/*MySurvey*/

body {
  width: 100%;
  height: 100vh;
  margin: 0;
  background-size: cover;
  background-image: url("room.jpg");
  background-color: rgba(222, 222, 222, 0.7); /* Semi-transparent black overlay */
  background-blend-mode: overlay; /* Blends image with color */
}

h1, p {
  text-align: center;
}

form {
  text-align: left;
  width: 60vw;
  max-width: 500px;
  min-width: 300px;
  margin: 0 auto;
  padding: 10px;
  background-color: #AEADA4;
}

fieldset:last-of-type {
  border-bottom: none;
}

input[type="submit"] {
  display: block;
  width: 30%;
  margin: 1em auto;
  height: 2em;
  font-size: 1.1rem;
  border-color: white;
}

div .p-info {
  padding-bottom: 10px;
}

div .check-in p {
  text-align: left;
  margin-top: 0px;
  margin-bottom: 0px; /* Space below the <p> */
}

div .check-in input {
  text-align: left;
  margin-bottom: 10px; /* Space below the <p> */
}

div .refer label {
  text-align: left;
  margin-bottom: 0px;
}

input [type="textarea"] {
  min-width: 400px;

}

input[type="text"] {
  width: 40vw; /* Matches form’s width */
  max-width: 400px; /* Matches form’s max-width */
}

input[type="email"] {
  width: 40vw; /* Matches form’s width */
  max-width: 400px; /* Matches form’s max-width */
}

input[type="number"] {
  width: 100px; 
}

input[type="textarea"] {
  width: 40vw; /* Matches form’s width */
  max-width: 400px; /* Matches form’s max-width */
  text-align: left; /* Aligns text (and cursor) to the left */
  vertical-align: top; /* Ensures content starts at the top */
  padding: 10px; /* Adds space inside, starting cursor at top-left corner */
  box-sizing: border-box; /* Keeps padding within width/height */
}

/* For Chrome, Edge, and Safari */
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin-bottom: 25px;
}

/* For Firefox */
input[type="number"] {
    -moz-appearance: textfield; /* Removes arrows */
    
}