.hfe-header,
.hfe-header-wrap,
header.header-top,
.site-header,
nav.header,
.elementor-section.hfe-header {
  border-bottom: none !important;
  box-shadow: none !important;
}

#content{padding: 10px 20px;}

#content .contact input[aria-invalid="true"],
#content .contact select[aria-invalid="true"],
#content .contact textarea[aria-invalid="true"],
ul.radio.error,
ul.checkbox.error,
ul.checkbox-radio.error,
ul.dob.error {
  /*outline: 2px solid #CC063B;*/
  /*border: 1px solid #CC063B !important;*/
}

input[type=date], input[type=email], input[type=number], input[type=password], input[type=search], input[type=tel], input[type=text], input[type=url], select, textarea {	
	border-radius: 25px !important;	
}


#content .contact span.mand,
#content .contact ul {
  list-style-type: none;
  margin: 0;
  padding: 0; }

#content .contact ul li {
  list-style-type: none;
  padding: 0;
  background: none;
  margin: 0 0 1.2em 0;
  clear: left;
}

/* Exception: phone number li should not clear left so it appears next to country code */
#liphonenumber {
  clear: none !important;
}

/* Clear float after phone number fields */
#liphonenumber::after {
  content: "";
  display: table;
  clear: both;
}

/* Ensure phone number li doesn't clear country code float so they appear side by side */
#licountryphonecode + #liphonenumber {
  clear: none !important;
  margin-top: 0 !important;
}

/* Add label above both phone fields using the country code li */
#licountryphonecode::before {
  content: 'My phone number: *';
  display: block;
  width: 100%;
  margin-bottom: 0.5em;
  clear: both;
  font-weight: normal;
  line-height: 1.8em;
  position: relative;
  z-index: 1;
}

#content .contact ul li li {
  margin: 0; }

#content .contact ul li.days fieldset li {
  margin: 0 2em 0 0;
  display: inline-block;
  clear: none;
  float: none; }

#content .contact ul li.short {
  clear: none;
  float: left;
  margin-left: 3%;
  margin-right: 0;
  width: 100%; }

#content .contact ul li.short.clear {
  clear: both;
  float: left;
  margin-right: 3%;
  margin-left: 0;
  width:100%; } 

#content .contact ul.dob {
  display: table;
  width: 100%; }

#content .contact ul.dob li {
  display: table-cell;
  padding-left: 2%; }

#content .contact ul.dob li:first-child {
  padding-left: 0; }

#content .contact ul.dob li.dob-d {
  width: 5em; }

#content .contact ul.dob li.dob-y {
  width: 6em; }

#content .contact ul li.check-radio {
  clear: left;
  margin: 0.4em 0; }

#content .contact ul li.check-radio input {
  clear: left;
  float: left;
  width: 15px;
  margin-top: 7px;
  margin-right: 0; }

#content .contact ul li.check-radio label {
  margin-left: 1.5em;
  width: auto; }

#content .contact ul li.submit {
  padding-top: 0.5em; }

#content .contact ul li.columns ul.checkbox-radio > li {
  display: inline-block;
  width: 45%;
  vertical-align: top; }

#content .contact label {
  display: block;
  margin: 0;
  text-align: left;
  line-height: 1.8em;
  font-weight: normal !important;  }

#content .contact label .text {
  width: auto;
  display: block;
  padding: 0 30px 0 0; 
  line-height: 1.6rem;
  font-weight: normal !important; }

#content .contact fieldset {
  width: 100%;
  display: block;
    margin: 0;
  padding: 0; }

#content .contact legend {
  width: 90%;
  display: block;
  padding: 0 30px 0 0;
    margin: 0 0 0.5em 0;
  font-weight: normal !important; }

#content .contact legend.valid,
#content .contact label.valid {
  background: transparent url(images/form-tick.png) no-repeat top right; }

#content .contact input, .contact select, .contact textarea {
  width: 100%; 
}

/* Exception: phone number input should not be 100% width */
#liphonenumber label input,
#liphonenumber input {
  width: 300px !important;
}

.contact select {
  background: #fff;
}

#content .contact li.submit input {
  width: auto;
  cursor: pointer; }

#content .contact .clarify {
  font-size: 0.8rem; }

#content .contact li.submit {
  display: inline-block;
  margin-right: 10px;
}

/* Container for submit buttons to control alignment */
#content .contact ul li.submit:first-of-type {
  float: left;
}

#content .contact ul li input[type="checkbox"]:not([name*="[]"]) {
  width: 24px !important;
  height: 24px !important;
  margin-right: 10px;
  margin-top: 0;
  vertical-align: middle;
  cursor: pointer;
  float: left;
}

/* Specific styling for do_not_consent_contact checkbox */
#do_not_consent_wrapper {
  margin-top: 1.2em;
  padding-top: 1.2em;
  border-top: 1px solid #ddd;
  clear: both;
}



#inf_field_referred_name_wrapper {
  display: none !important;
}

/* Show the field when Yes is selected (this will override the default hide) */
#inf_field_referred_name_wrapper.show-referred-field {
  display: block !important;
}

#inf_field_referred_name_wrapper {
  display: none !important;
}

/* Show the field when Yes is selected (this will override the default hide) */
#inf_field_referred_name_wrapper.show-referred-field {
  display: block !important;
}


#do_not_consent_wrapper label {
  display: block !important;
  cursor: pointer;
  line-height: 1.8em;
  overflow: hidden;
}

#do_not_consent_wrapper input[type="checkbox"] {
  width: 24px !important;
  height: 24px !important;
  margin-right: 10px !important;
  margin-top: 2px !important;
  float: left;
  cursor: pointer;
  flex-shrink: 0;
}

#do_not_consent_wrapper label .text {
  display: inline-block !important;
  padding: 0 !important;
  margin-left: 0 !important;
  width: auto;
  line-height: 1.6rem;
}


#content .contact ul li.submit:last-of-type {
  float: right;
}

#do_not_consent_wrapper label::after,
#do_not_consent_wrapper label .text::after,
#do_not_consent_wrapper label::before,
#do_not_consent_wrapper label .text::before,
#do_not_consent_wrapper li label::after,
#do_not_consent_wrapper li label .text::after {
  content: "" !important;
  display: none !important;
}

/* Additional specificity to override any other rules */
#content #do_not_consent_wrapper label::after,
#content #do_not_consent_wrapper label .text::after {
  content: "" !important;
  display: none !important;
}

/* Clear float after submit buttons */
#content .contact ul li.submit:after {
  content: "";
  display: table;
  clear: both;
}

#content .contact li.submit.save-later input {
  /* background-color: #6c757d;
  border-color: #6c757d;
  color: white; */
  background-color: #f6d578;
  /* border-color: #f6d578; */
  border: 2px solid #2a3258;
  color: #28325a;
}

#content .contact li.submit.save-later input:hover {
  /* background-color: #5a6268;
  border-color: #545b62; */
    background-color: #f4cd5a;
      border: 2px solid #2a3258;
  /* border-color: #f4cd5a; */
  color: #28325a;
}

#content .contact {
  margin-bottom: 40px;
  padding-bottom: 30px;
  position: relative;
  z-index: 1;
}

#content .contact legend.expandableLegend::after {
  content: none !important;
}

#content .contact legend.expandableLegend {
  content: none;
}

/* Ensure submit buttons stay within form boundaries */
/* #content .contact ul {
  margin-bottom: 30px;
  padding-bottom: 20px;
} */

/* Clear floats after the form list */
#content .contact ul:after {
  content: "";
  display: table;
  clear: both;
}

#content .contact li.submit.previous-button input {
  background-color: #f6d578;
  /* border-color: #f6d578;
   */
     border: 2px solid #2a3258;
  color: #28325a;
}

#content .contact li.submit.previous-button input:hover {
  background-color: #f4cd5a;
  /* border-color: #f4cd5a; */
  border: 2px solid #2a3258;
  color: #28325a;
}

#content .contact .err-img {
  border: none; }

#content .contact .errors,
#content .contact .fieldseterrors {
  background: #fff;
  color: #CC063B;
 }


input[type=button], input[type=submit], button{
	background-color: var( --e-global-color-acad472 );
    color: #ffffff;
	font-family: "Roboto", Sans-serif;
    font-size: 19px;
    font-weight: 400;
    border-radius: 25px 25px 25px 25px;
    padding: 15px 30px 15px 30px;
	border: 0px ;
}

input[type=button]:focus, input[type=button]:hover, input[type=submit]:focus, input[type=submit]:hover, button:focus, button:hover{
	color: #fff;
    background-color: var( --e-global-color-secondary );
    text-decoration: none;	
}



#content fieldset{
      margin: 0;
	padding: 0px;
    border: 0px;	
}

#content fieldset legend{	
	font-weight:normal;
      margin: 0;
    padding: 0;
}

.txtbold{
	font-weight:500;
}


@media (min-width: 1350px){
	#content {
		margin: auto;
    	width: 50%;
	}		
}


@media (max-width: 425px) {
	.youtube{
		width:98%;
		height:250px;
	}
}

.terms {
  margin-left: 20px !important;
}

.terms li {
  list-style-type:disc !important;
	padding-bottom:20px !important;
} 

.form-intro-list {
  list-style-type: disc !important;
  margin-left: 20px !important;
  padding-left: 0 !important;
}

.form-intro-list li {
  list-style-type: disc !important;
  padding-bottom: 10px !important;
  margin-bottom: 0 !important;
} 

.privacy-intro-list {
  list-style-type: disc !important;
  /* margin-left: 20px !important; */
  padding-left: 0 !important;
}

.privacy-intro-list li {
  margin-left: 40px !important;
  list-style-type: disc !important;
  padding-bottom: 5px !important;
  margin-bottom: 0 !important;
}

.sectionhead {
  background-color: #29325a;
	color:#FFFFFF;
  padding: 5px 5px 5px 16px;
  border-radius: 1px;
  font-size: 1.8rem;
}

.sectionwrapper {
 /* display: grid;
  grid-template-areas: "list illus";
  grid-template-columns: 55% 45%;
  grid-template-rows: auto;
  row-gap: 20px;*/
}

.privacy_bannercontent {
  background-color: #29325A;
  padding: 5px 5px 5px 16px;
  margin-top: 20px;
  color: white;
}

.bannerleftcol {
  grid-area: "list";
}

.sectionlist {
  
}

.bannerrightcol {
  grid-area: "illus";
  /* max-width: 400px; */
  display: flex;
  justify-content: center;
  max-height: 300px;
}

.bannerillustration {  
  width: 400px;
  height: 300px;
	padding-bottom:20px;
  position: relative;
  /* background: #FFFFFF; */
  /* top: -50px; */
}


.bannercontent {
  background-color: #ABD9F3;
  padding: 5px 5px 5px 16px;
  border-radius: 25px;  
  margin-top: 20px;
}

.support_bannercontent {
  background-color: #29325A;
  padding: 5px 5px 5px 16px;
  margin-top: 20px;
  color: white;
}

.country_code .custom{
  padding-top : 10px !important;
}

li.clear.edit_phone .text {
  display: none;
  margin-left: 0 !important;
}

.bannerlicontent {
  list-style-type:disc !important;
  padding: 5px;
  margin-left: 10px !important;
}

.bannerdropdown {
  float:right;
  padding-right:20px;
  width:50px;
  height:25px
}

/*
.bannerlicontent {
  display: grid;
  grid-template-areas: "listimage listcontent";
  grid-template-columns: 20% 80%;

}

.listimage {
  grid-area: "listimage";
  width: 100px;
  height: 100px;
}

.listcontent {
  grid-area: "listcontent";
  padding: 10px;
}*/

.showpassword {
  padding: 2px 8px !important;
  width: auto !important;
  font-size: 14px !important;
}

label div.custom {
	  position: relative;
    width: 100%;
    /* display: inline; */
}

label div.custom::before {
    content: '';
    border-top: 8px solid #666;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    position: absolute;
    right: 12px;
    z-index: 2;
    top: 17px;
}

label div.custom::after {
    content: '';
    position: absolute;
    width: 16px;
    height: 16px;
    background: white;
    right: 4px;
    border-radius: 50%;
    top: 10px;
}


#licountryphonecode .custom {
  width: 100% !important;
  margin: 0 !important;
  /* margin-top: 6px; */
}

/* Account page edit button */
/* .edit_profile_section {
  display: flex;
  justify-content: space-evenly;
} */

/* Phone number container styling - Single combined field */
.phone-field-part {
  margin-bottom: 0 !important;
}

/* Create a container for both phone fields */
#licountryphonecode {
  margin-bottom: 0 !important;
  margin-right: 0 !important;
  width: auto;
  min-width: 150px;
  max-width: 200px;
  clear: none !important;
  float: left !important;
  display: inline-block;
}

/* Hide label for country code field */
#licountryphonecode label,
#licountryphonecode label .text {
  display: none !important;
}

/* Style country code dropdown to look like part of combined input */
#licountryphonecode .custom {
  width: 100% !important;
  margin: 0 !important;
  display: block;
}

#licountryphonecode .custom select {
  border-radius: 25px 0 0 25px !important;
  border-right: none !important;
  padding-right: 35px;
  height: 100%;
  width: 100%;
}

/* Position the phone number field container - float next to country code */
#liphonenumber {
  margin-bottom: 1.2em !important;
  float: left !important;
  width: auto !important;
  min-width: 300px;
  overflow: visible;
  clear: none !important;
  position: relative;
  margin-left: 0 !important;
  margin-top: 0 !important;
}

/* Hide the actual label text since we're using ::before on country code */
#liphonenumber label .text {
  display: none !important;
}

/* Style the label to allow input to float properly - ensure it doesn't hide the input */
#liphonenumber label {
  display: inline-block !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  clear: none !important;
  float: none !important;
  overflow: visible !important;
  position: relative;
}

/* Make the phone number input appear inline with country code - CRITICAL: ensure it's visible */
#liphonenumber label input[type="text"],
#liphonenumber label input[type="tel"],
#liphonenumber input[type="text"],
#liphonenumber input[type="tel"] {
  border-radius: 0 25px 25px 0 !important;
  border-left: none !important;
  width: 300px !important;
  min-width: 200px;
  max-width: 400px;
  margin: 0 !important;
  margin-top: 0 !important;
  padding: 8px 12px !important;
  display: inline-block !important;
  visibility: visible !important;
  opacity: 1 !important;
  float: none !important;
  clear: none !important;
  position: relative !important;
  z-index: 10 !important;
  background-color: #fff !important;
  border: 1px solid #ddd !important;
  box-sizing: border-box !important;
  height: auto !important;
  line-height: normal !important;
  font-size: 16px !important;
  color: #000 !important;
}

/* Override any general input styles that might hide the phone input */
#liphonenumber label input {
  width: 300px !important;
  display: inline-block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/* Add focus states for combined appearance */
#licountryphonecode .custom select:focus,
#liphonenumber input:focus {
  outline: none;
  border-color: #2a3258;
  box-shadow: 0 0 0 2px rgba(42, 50, 88, 0.2);
}

/* Ensure proper alignment on mobile */
@media screen and (max-width: 768px) {
  #licountryphonecode {
    width: 100% !important;
    max-width: 100%;
    float: none !important;
    margin-bottom: 0.5em;
  }
  
  #licountryphonecode .custom {
    width: 100% !important;
  }
  
  #licountryphonecode .custom select {
    border-radius: 25px !important;
    border-right: 1px solid #ddd !important;
    width: 100%;
  }
  
  #liphonenumber {
    width: 100% !important;
    float: none !important;
    clear: both !important;
  }
  
  #liphonenumber input[type="text"],
  #liphonenumber input[type="tel"] {
    border-radius: 25px !important;
    border-left: 1px solid #ddd !important;
    width: 100% !important;
    min-width: 100%;
  }
}

.edit_button, .click-here {
  position: sticky;
  top: 0;
  align-self: flex-start;
  background-color: #29325a;
  color: white;
  font-family: "Poppins", Sans-serif;
  font-size: 1rem;
  font-weight: 500;
  border-style: solid;
  border-width: 2px 2px 2px 2px;
  border: 1px solid #fec952;
  border-radius: 25px 25px 25px 25px;
}

.edit_button a{
  text-decoration: none !important;
}

.edit_button:hover{
  background-color: #F6D578 !important;
  border-color: #FFFFFF;
}

.edit_button:hover .edit_button_navigation{
  color: #28325A !important;
}
/* main:has(div.edit_profile_section){
  width: 100% !important;
} */


/* #content {
  width: 100% !important;
} */






.check-radio input[type="checkbox"], .check-radio input[type="radio"] {
	
	width:24px !important;
	height:24px !important;	
}




/*
.check-radio input[type="checkbox"], .check-radio input[type="radio"] {
    padding: 0;
    height: initial;
    width: initial;
    margin-bottom: 0;
    display: none;
    cursor: pointer;
}
.check-radio label {
    position: relative;
    cursor: pointer;
    margin-left: 0 !important;
}

.check-radio label::before
{
    content: '';
    -webkit-appearance: none;
    background-color: transparent;
    border: 2px solid #2a325a;
    box-shadow: 0 1px 2px rgb(0 0 0 / 5%), inset 0px -15px 10px -12px rgb(0 0 0 / 5%);
    padding: 10px;
    display: inline-block;
    position: relative;
    vertical-align: middle;
    cursor: pointer;
    margin-right: 5px;
}
*/


body.contrast .check-radio label::before{
  border: 2px solid #ffffff;
}
body.contrast .check-radio input:checked + label:after {
  border: solid #ffffff;
  border-width: 0 2px 2px 0;
}
body.contrast .check-radio input[type="radio"]:checked + label:after {
  border: solid #ffffff;
  border-width: 0 2px 2px 0;
  background: #ffffff ;
}

body.contrast a{
  color : #f6d578;
}
body.contrast a:hover{
  color : #ffffff;
}

.check-radio input:checked + label:after
{
    content: '';
    display: block;
    position: absolute;
    top: 10px;
    left: 9px;
    width: 6px;
    height: 14px;
    border: solid #2a325a;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

.check-radio input[type="radio"] + label::before
{
    border-radius: 50%;
}
.check-radio input[type="radio"]:checked + label:after
{
    top: 12px;
    left: 5px;
    width: 14px;
    height: 14px;
    background: #2a325a;
    border-radius: 50%;
}

#content h2:after,
.contact h2:after,
h2:not(.check-radio label):after {
    content: none !important;
    display: none !important;
}

img.thank-you-image {
  width: 400px;
}

p.thankyou-image-display {
  display: flex;
  padding-bottom: 20px;
  justify-content: center;
}

@media screen and (max-width:450px) {
  .phone-number-text{
    margin-left: -85px !important;
  }
}

body.contrast .attachment-full.size-full{
  background-color : transparent;
}

.preferred_text{
  font-size: 15px;
  font-weight: 400;
}

.click-here{
  /* width: fit-content;
  background-color: #29325a !important; */
  padding: 15px 30px 15px 30px!important;
  cursor: pointer;
}

.buttonExpand {
  border: none !important;
  color: white !important;
  font-size: 100% !important;
  padding: 0 !important;
  width: 100% !important;
}

.buttonExpand :hover{
  background-color: #29325A !important;
}

.child-list{
  padding-left:30px !important;
}
ul.sub-list li {
  list-style-position: inside;
  list-style-type: circle !important;
}


.form-section-header .section-title {
  margin: 0 0 5px;
  font-size: 18px;
  font-weight: 600;
  color: #333;
}

.form-section-header .section-title .required {
  color: red;
  font-weight: normal;
}

.form-section-header .section-description {
  margin: 0;
  font-size: 14px;
  color: #555;
}

/* Step 8 Password Field Styling */
.password-field-wrapper {
  position: relative;
  display: flex;
  align-items: center;
  gap: 10px;
}

.password-field-wrapper input[type="password"],
.password-field-wrapper input[type="text"] {
  flex: 1;
  padding: 10px;
  border: 1px solid #ddd;
  border-radius: 4px;
  font-size: 16px;
}

.toggle-password,
.generate-password {
  padding: 8px 12px;
  background-color: #007cba;
  color: white;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  font-size: 14px;
  transition: background-color 0.3s;
}

.toggle-password:hover,
.generate-password:hover {
  background-color: #005a87;
}

.generate-password {
  background-color: #28a745;
}

.generate-password:hover {
  background-color: #1e7e34;
}

/* Username field styling */
#inf_field_UserName {
  background-color: #f8f9fa;
  color: #6c757d;
}

#password-mismatch-error {
  color: #dc3545 !important;
  display: block !important;
  margin-top: 10px !important;
  margin-bottom: 0 !important;
  font-size: 14px;
  clear: both;
  width: 100%;
}

/* Phone field combined wrapper styling for registration form */
.phone-field-combined-wrapper {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  max-width: 600px;
  margin-top: 0.5em;
}

.phone-country-code-wrapper {
  flex: 0 0 auto;
  min-width: 150px;
  max-width: 200px;
  position: relative;
  overflow: visible;
}

.phone-country-code-wrapper::after {
  content: '';
  position: absolute;
  right: 15px;
  top: 50%;
  transform: translateY(-50%);
  width: 0;
  height: 0;
  /* border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 8px solid #fff; */
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  /* border-top: 6px solid #fff; */
   border-top: 6px solid #000;
  pointer-events: none;
  z-index: 10;
}

.phone-country-code-wrapper select {
  width: 100% !important;
  padding: 8px 12px !important;
  padding-right: 40px !important;
  border: 1px solid #666 !important;
  border-radius: 25px !important;
  /* border-right: none !important; */
  height: 38px !important;
  font-size: 16px !important;
  background-color: #fff !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  box-sizing: border-box !important;
  position: relative;
  z-index: 1;
}

.phone-number-input-wrapper {
  flex: 1 1 auto;
  min-width: 200px;
}

.phone-number-input-wrapper input {
  width: 100% !important;
  padding: 8px 12px !important;
  border: 1px solid #666 !important;
  /* border-radius: 0 25px 25px 0 !important;
  border-left: none !important; */
  border-radius: 25px !important;
  height: 38px !important;
  font-size: 16px !important;
  box-sizing: border-box !important;
}

.phone-combined-label {
  display: block;
  margin-bottom: 0.5em;
  width: 100%;
}

.phone-combined-label .text {
  display: block;
  font-weight: normal;
  line-height: 1.8em;
}

#content h2::before,
#content h2::after,
.contact h2::before,
.contact h2::after,
h2::first-letter::before,
h2::first-letter::after {
  content: none !important;
  display: none !important;
  background: none !important;
  border: none !important;
}

/* Remove any overlays or indicators on headings */
#content h2,
.contact h2 {
  position: relative;
}

#content h2 *::before,
#content h2 *::after,
.contact h2 *::before,
.contact h2 *::after {
  content: none !important;
  display: none !important;
}

/* Responsive: stack phone components on smaller screens */
@media screen and (max-width: 768px) {
  .phone-field-combined-wrapper {
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
    max-width: 100%;
  }
  
  .phone-country-code-wrapper {
    width: 100%;
    max-width: 100%;
    /* margin-bottom: 0.5em; */
  }
  
  .phone-country-code-wrapper select {
    border-radius: 25px !important;
    /* border-right: 1px solid #ddd !important; */
  }
  
  .phone-number-input-wrapper {
    width: 100%;
  }
  
  .phone-number-input-wrapper input {
    border-radius: 25px !important;
    /* border-left: 1px solid #ddd !important; */
  }
}

@media screen and (max-width: 768px) {
  .password-field-wrapper {
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
    width: 100%;
  }

  .password-field-wrapper input[type="password"],
  .password-field-wrapper input[type="text"] {
    width: 100% !important;
    border-radius: 25px !important;
  }

  .toggle-password,
  .generate-password {
    width: 100%;
    border-radius: 25px !important;
  }
}

#do_not_consent_wrapper label::after,
#do_not_consent_wrapper label .text::after {
  content: none !important;
  display: none !important;
}