body {
  font-family: "DM Sans", sans-serif;
  background: #F6B255;
}

.booking-container {
  max-width: 700px;
  background: #fff;
  padding: 20px;
  margin: 40px auto;
  border-radius: 10px;
}


.logo {
    display: flex;
    justify-content: center;
}

.logo img{
  width: 300px;;
  margin-bottom: 10px;
}

h2 {
  text-align: center;
  /* margin-bottom: 10px; */
}

p {
  text-align: center;
  margin-bottom: 20px;
}

input, textarea, button, select{
  width: 100%;
  margin-bottom: 12px;
  padding: 15px 0;
  padding-left: 5px;
  border-radius: 5px;
  outline: none;
  border: 1px solid #ccc;
}

#time-slots select{
  cursor: pointer;
}

.agreement {
  margin: 16px 0;
  font-size: 14px;
  color: #444;
}

.agreement a {
  color: #DC9B42;
  text-decoration: underline;
}

.agreement input {
  margin-right: 6px;
}

.agreement {
  margin-top: 16px;
}


/* Default disabled button state */
#submit-btn {
  width: 100%;
  padding: 14px;
  font-family: 'DM Sans', sans-serif;
  font-size: 16px;
  font-weight: 600;
  border: none;
  border-radius: 6px;
  cursor: not-allowed;
  background-color: #cfcfcf; /* disabled grey */
  color: #777;
  transition: background-color 0.3s ease, color 0.3s ease;
}

/* Enabled state (when checkbox is checked) */
#submit-btn:not(:disabled) {
  background-color: #2F2F2F; /* 🔥 your original button color */
  color: #fff;
  cursor: pointer;
}

/* Hover effect only when enabled */
#submit-btn:not(:disabled):hover {
  opacity: 0.9;
}

/* button {
  background: #F6B255;
  color: #fff;
  border: none;
  cursor: pointer;
  padding: 20px 0;
  font-size: 16px;
  border-radius: 10px;
}

button:hover{
  background: #DC9B42;
  color: #fff;
  border: none;
  cursor: pointer;
  padding: 20px 0;
  font-size: 16px;
  border-radius: 10px;
} */


