/*!
 * Affiliate Page - CSS
 * Migrated 2026-05-21 from WPCode snippet #7967.
 * Enqueue condition: Affiliate page
 */

/* ============================= */

/* === AFFILIATE PAGE STYLES === */

/* ============================= */



/* === General Container Fixes === */

#brx-content {

  max-width: 1200px;

  margin: 0 auto;

  padding: 2rem 1rem;

  box-sizing: border-box;

}



/* === HERO SECTION === */

#affiliate-hero {

  text-align: center;

  padding-left: 3rem;

	padding-right:3rem;

  max-width: 800px;

  margin-left: auto;

  margin-right: auto;

		text-align:center;

	align-items:center;

	align-content:center;

	align-self:center;

}



#affiliate-hero h2 {

  font-size: 1.2rem;

  font-weight: 700;

  margin-bottom: 1rem;

  line-height: 1.3;



}



#affiliate-hero p {

  font-size: 1.125rem;

  max-width: 600px;

  margin: 0 auto 1.5rem auto;

}



#apply-now {

  display: inline-block;

  padding: 0.85rem 1.5rem;

  font-size: 1rem;

  font-weight: 600;

  background-color: #ffcc00;

  color: #000;

  border-radius: 6px;

  cursor: pointer;

  transition: background 0.2s ease-in-out;

	  text-align: center;

  max-width: 800px;

  margin-left: auto;

  margin-right: auto;

}



#apply-now:hover {

  background-color: #e6b800;

}



/* === HOW IT WORKS === */

#affiliate-how-it-works {

  display: flex;

  flex-wrap: wrap;

  justify-content: center;

  text-align: center;

  gap: 2rem;

  padding: 2rem 0;

  max-width: 900px;

  margin-left: auto;

  margin-right: auto;

	

}



#affiliate-how-it-works > div {

  flex: 1 1 250px;

  max-width: 250px;

  font-size: 1rem;

  line-height: 1.4;

	max-height:30px

}



/* === FORM SECTION === */

#affiliate-signup-form {

  background: #f8f8f8;

  padding: 2.5rem 1.5rem;

  border-radius: 10px;

  margin-top: 2rem;

  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.04);

  max-width: 900px;

  margin-left: auto;

  margin-right: auto;

	

}



#affiliate-signup-form h3 {

  text-align: center;

  font-size: 1.5rem;

  font-weight: 700;

  margin-bottom: 0.5rem;

		  text-align: center;

  max-width: 800px;

  margin-left: auto;

  margin-right: auto;

}



#affiliate-signup-form p {

  text-align: center;

  font-size: 1rem;

  margin-bottom: 2rem;

		  text-align: center;

  max-width: 800px;

  margin-left: auto;

  margin-right: auto;

}



.affiliate-form-class {

  max-width: 600px;

  margin: 0 auto;

  display: flex;

  flex-direction: column;

  gap: 1.25rem;

}



/* === Form Fields === */

.affiliate-form-class .form-group input,

.affiliate-form-class .form-group textarea {

  width: 100%;

  padding: 0.75rem;

  font-size: 1rem;

  border-radius: 6px;

  border: 1px solid #ccc;

  transition: border 0.2s ease-in-out;

  box-sizing: border-box;

}



.affiliate-form-class .form-group input:focus,

.affiliate-form-class .form-group textarea:focus {

  border-color: #007cba;

  box-shadow: 0 0 0 2px rgba(0, 124, 186, 0.15);

  outline: none;

}



/* === Submit Button === */

.submit-button-wrapper {

  display: flex;

  justify-content: center;

  margin-top: 1rem;

}



.submit-button-wrapper button {

  font-size: 1.1rem;

  font-weight: 600;

  padding: 0.85rem 2rem;

  border-radius: 6px;

  background-color: #000;

  color: #fff;

  border: none;

  cursor: pointer;

}



.submit-button-wrapper button:hover {

  background-color: #222;

}



.submit-button-wrapper .loading {

  display: none;

}

#affiliate-faq {

		align-items:center;

	text-align:left;

}

/* === FAQ Section === */

#affiliate-faq h3 {

  font-size: 1.5rem;

  margin-top: 3rem;

  margin-bottom: 1.25rem;

  font-weight: 700;

	

	

}



.affiliate-faq-section-list {

  list-style: none;

  padding: 0;

  max-width: 800px;

  margin: 0 auto;

}



.affiliate-faq-section-list li {

  border: 1px solid #e2e2e2;

  background: #fff;

  border-radius: 6px;

  padding: 1.25rem;

  margin-bottom: 1.25rem;

}



.affiliate-faq-section-list .title {

  display: block;

  font-weight: 600;

  font-size: 1.1rem;

  margin-bottom: 0.5rem;

}



.affiliate-faq-section-list .description {

  font-size: 0.975rem;

  color: #444;

}



/* ======================= */

/* === MOBILE OVERRIDES === */

/* ======================= */

@media screen and (max-width: 767px) {

  #affiliate-hero h2 {

    font-size: 1.2rem;

  }



  #affiliate-hero p {

    font-size: 1rem;

  }



  #apply-now {

    width: 100%;

    padding: 1rem;

  }



  #affiliate-how-it-works {

    flex-direction: column;

    align-items: center;

  }



  .affiliate-form-class {

    padding: 0 0.5rem;

  }



  #affiliate-signup-form {

    padding: 2rem 1rem;

  }



  .submit-button-wrapper button {

    width: 100%;

  }

}