.header-list li p{
  margin-bottom: 0;
  font-size: 14px;
}
#contact-form-1 p {
  margin-bottom: 0;
}
#contact-form-1 label {
  margin-bottom: 6px;
}
input[type="text"], textarea, select.wpcf7-form-control.wpcf7-select {
  width: 100%;
  border: 1px solid #e5e5e5;
  color: #000000;
  background-color: #fff;
  box-sizing: border-box;
  transition: border-color 0.3s;
  font-size: 16px;
  line-height: 35px;
  padding: 27px 30px;
}

.question-label {
  color: #f7695d;
  font-size: 16px;
  margin-top: 30px;
  line-height: 25px
}

textarea {
  height: 90px;
  resize: none;
}

input[type="text"]:focus, textarea:focus, select:focus {
  color: #000;
  border-color: #0896a2;
  border-width:1px;
  border-style:solid;
  outline: none;
  /* Set text color to black when focused */
}

.error-message {
  color: red;
  font-size: 14px;
  margin-top: -10px;
  margin-bottom: 10px;
  display: none;
}

.wpcf7-list-item {
  margin: 0;
}

.height-56{
  height: 56px;
  padding: 0 30px !important;
  color: grey !important;
}

.question-header {
  color: #560b3e;
  font-weight: bold;
  font-size: 32px;
  margin-top: 20px;
  margin-bottom: 0;
  line-height: normal;
}



.question-container {
  margin-bottom: 20px;
  width: 70%;
}

.line-height-color-black {
  line-height: 28px;
  color: #000000;
}

.wpcf7-submit {
  visibility: hidden;
}

.custom-submit-button {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 24px;
  font-size: 16px;
  font-weight: bold;
  color: #000000;
  background-color: #ffffff;
  border: 1px solid #e5e5e5;
  border-radius: 50px;
  box-shadow: none;
  cursor: pointer;
  transition: all 0.3s ease;
  position: relative;
  overflow: hidden;
  outline: none;
  text-align: left;
}

.custom-submit-button:hover {
  background-color: #f5f5f5;
  border-color: #cccccc;
}

.custom-submit-button:disabled {
  cursor: not-allowed;
  opacity: 0.5;
}

.custom-submit-button:focus {
  box-shadow: 0 0 0 2px #0896a2;
}

.arrow-icon-container {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px; /* Adjust width for the circle */
  height: 36px; /* Adjust height for the circle */
  background-color: #f5f5f5; /* Grey background for the circle */
  border-radius: 50%; /* Make it circular */
  margin-left: 10px;
  transition: all 0.3s ease;
}

.arrow-icon {
  font-size: 24px;
  color: #4d3b5d; /* Adjust the color to match your design */
  transition: margin-left 0.3s ease;
}

.custom-submit-button:hover .arrow-icon-container {
  background-color: #e0e0e0; /* Slightly darker grey on hover */
}

.custom-submit-button:hover .arrow-icon {
  margin-left: 5px; /* Slight movement on hover for a dynamic effect */
}

.wpcf7-not-valid-tip {
  color: #0896a2;
}

.wpcf7 form.invalid .wpcf7-response-output, .wpcf7 form.unaccepted .wpcf7-response-output, .wpcf7 form.payment-required .wpcf7-response-output {
  border: 1px solid #e5e5e5;
  color: #0896a2;
}

/* Style the select dropdown */
.wpcf7-form-control.wpcf7-select {
  width: 100%;
  padding: 15px;
  padding-right: 50px; /* Make space for the custom arrow */
  font-size: 16px;
  line-height: 1.5;
  color: #000000;
  background-color: #fff;
  border: 1px solid #e5e5e5;
  border-radius: 5px;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background-image: none;
  position: relative;
  box-sizing: border-box;
  transition: border-color 0.3s;
}

/* Focus state for the select dropdown */
.wpcf7-form-control.wpcf7-select:focus {
  border-color: #0896a2;
  outline: none;
  color: #000; /* Ensure text is black on focus */
}

/* Custom arrow */
.wpcf7-form-control-wrap {
  position: relative;
}

.wpcf7-form-control-wrap select::after {
  content: '▼'; /* Unicode for downward arrow */
  font-size: 14px;
  color: #4d3b5d;
  position: absolute;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
}

/* Custom arrow for opened select (upwards arrow) */
.wpcf7-form-control-wrap select:focus::after {
  content: '▲'; /* Unicode for upward arrow */
}

/* Remove the default select arrow in IE */
.wpcf7-form-control.wpcf7-select::-ms-expand {
  display: none;
}

/* Optional: Style options within the dropdown */
.wpcf7-form-control.wpcf7-select option {
  padding: 10px;
  background-color: #fff;
  color: #000;
}

.wpcf7-form-control.wpcf7-select:disabled {
  color: #ccc;
  background-color: #f5f5f5;
}
.wpcf7-form-control.wpcf7-select{
  position: relative;
  box-sizing: border-box;
  transition: border-color 0.3s;
  -webkit-appearance: none;
  -moz-appearance: none;
  /* background: transparent; */
  /* background-image: url(data:image/svg+xml;utf8,<svg fill='black' height='24' viewBox='0 0 24 24' width='24' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/><path d='M0 0h24v24H0z' fill='none'/></svg>); */
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNSIgaGVpZ2h0PSIyNSIgZmlsbD0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2U9IiNiYmIiPjxwYXRoIGQ9Ik02IDlsNiA2IDYtNiIvPjwvc3ZnPg==) !important;
  color:grey;
  background-repeat: no-repeat;
  background-position-x: 99%;
  background-position-y: 14px;
  /* border: 1px solid #e4a5a5; */
  border-radius: 2px;
  margin-right: 2rem;
  padding: 1rem;
  padding-right: 2rem;}
@media (max-width: 768px) {
  .question-container {
    width: 100%;
  }

}





.header-list {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.25s ease;
}

.header-list.open {
  max-height: 800px; /* Set this to a value that accommodates your content */
}
.accordion-down-arrow::after {
  content: '\25BC'; /* Unicode for down arrow */
  display: inline-block;
  margin-left: 8px;
}

.accordion-down-arrow.active::after {
  content: '\25B2'; /* Unicode for up arrow */
}

#contact-form-1 p {
  cursor: pointer;
  user-select: none;
}
#contact-form-1 .headline{
  position:relative;
  cursor: pointer;
}
#contact-form-1 .accordion-down-arrow-custom-form{
  background-image: url(../../images/up-arrow.svg);
  /* bottom: -3px; */
  position: relative;
  height: 26px;
  width: 26px;
  background-repeat: no-repeat;
  transform: rotate(-180deg);
  transition: all ease 250ms;
  display: inline-block;
  margin-left: 3px;
}
#contact-form-1 .accordion-down-arrow-custom-form.open{
  transform: rotate(0deg);
}
