/* Apply a healthcare-themed background gradient */
body {
  background-color: #055fad; /* Light blue healthcare-related color */
  font-family: Arial, sans-serif;
  margin: 0;
  padding: 0;
}


/* Input fields styling */
input[type=message], input[type=email], input[type=text], textarea {
  width: 100%;
  padding: 12px;
  border: 1px solid #ccc;
  border-radius: 4px;
  box-sizing: border-box;
  margin-top: 6px;
  margin-bottom: 16px;
  resize: vertical;
  font-size: 16px;
  background-color: #f9f9f9; /* Soft white background for inputs */
}

/* Submit button styling */
button[type=submit] {
  background-color: #028090; /* Deep teal color for button */
  color: white;
  padding: 12px 20px;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  font-size: 16px;
}

/* Hover effect for the submit button */
button[type=submit]:hover {
  background-color: #05668d; /* Darker teal on hover */
}

/* Hide Streamlit Branding */
#MainMenu {visibility: hidden;}
footer {visibility: hidden;}
header {visibility: hidden;}

/* Add padding and style to the container where the form is placed */
.container {
  max-width: 600px;
  margin: 50px auto;
  background-color: rgb(188, 172, 172);
  padding: 30px;
  border-radius: 8px;
  box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
}

/* Add a header for your healthcare system */
h1 {
  text-align: center;
  color: #034f84; /* Dark blue for healthcare theme */
  font-size: 36px;
}

/* Add a healthcare related icon */
h1:before {
  content: ""; /* Healthcare emoji */
}

/* Healthcare themed colors */
h2 {
  color: #028090; /* Deep teal for subheadings */
  font-size: 24px;
  margin-bottom: 20px;
  text-align: center;
}

/* Style for labels */
label {
  font-weight: bold;
  color: #034f84; /* Dark blue for label text */
}