/* Form container styling */
    .form-container {
      background-color: black;
      padding: 20px;
      border-radius: 8px;
      box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
      width: 80vw;
      max-width: 600px;
    }

    .form-container h2 {
      color: #e7c885;
      font-size: 2.5vh;
      text-align: center;
    }

    .form-container input,
    .form-container textarea {
      width: 99%;
      padding: 1vh;
      margin: 10px 0;
      color: #000000;
      background-color: #b7ad9b;
      border: 2px solid #e7c885;
      border-radius: 5px;
      box-sizing: border-box;
    }

    .form-container button {
      width: 99%;
      padding: 1vh;
      background-color: rgba(0, 0, 0, 0);
      color: #e7c885;
      border: 2px solid #e7c885;
      border-radius: 5px;
      cursor: pointer;
      font-size: 3dvh;
    }

    .form-container button:hover {
      background-color: #e7c885;
      color: #000;
    }

    .form-container label {
      color: #e7c885;
      font-size: 2dvh;
    }

    /* Centering the loader */
    .loading-container {
      display: flex;
      justify-content: center;
      align-items: center;
      height: 10vh;
      background-color: #000000;
    }

    /* The loader */
    .spinner {
      width: 50px;
      height: 50px;
      border: 5px solid #ccc;
      /* Light gray border */
      border-top: 5px solid #333;
      /* Darker border on top */
      border-radius: 50%;
      /* Make it a circle */
      animation: spin 1s linear infinite;
    }

    /* Spinner animation */
    @keyframes spin {
      from {
        transform: rotate(0deg);
      }

      to {
        transform: rotate(360deg);
      }
    }