/* ==== Layout Fixes ==== */
body,
html {
  overflow-x: hidden !important;
  padding: 0;
  margin: 0;
}

/* ==== Navigation Hover Style ==== */
.wp-block-navigation-item__label:hover {
  color: #d0d0d0;
  text-decoration: underline;
}

/* ==== Product Column Layout ==== */
.productColumn {
  justify-content: space-between !important;
  height: 100%;
}

/* ==== Button Styling ==== */
#zc-manage {
  background-color: #29ABE2;
  border: none;
}
#zc-manage:hover {
  background-color: #29ABE3BF;
  border: none;
}

/* ==== Form Input Styling ==== */
div.zcinputbox {
  min-width: 100% !important;
  padding-top: 5px;
}

/* ==== Signup Page Padding Fixes ==== */
#SIGNUP_BODY {
  padding: 0px !important;
}
#SIGNUP_PAGE {
  padding-top: 0px !important;
}

/* ==== Global Form Scroll & Box Control ==== */
#quoteForm,
#quoteForm * {
  box-sizing: border-box !important;
  max-width: 100% !important;
  overflow-x: hidden !important;
}

/* ==== reCAPTCHA Section Fixes ==== */
#captcha {
  display: flex !important;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 10px;
  max-width: 100%;
  width: 100%;
  box-sizing: border-box;
  overflow: visible !important;
}

#recapDiv {
  width: 100% !important;
  max-width: 304px !important;
  box-sizing: border-box !important;
  overflow: visible !important;
  margin: 0 auto !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
}

#recapDiv > div {
  width: 304px !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* Don't style iframe directly — causes Google CAPTCHA to break */

/* ==== Hide extra duplicate recaptcha container if it appears ==== */
#captcha + div[style*="position"] {
  display: none !important;
}

/* ==== Label Widths ==== */
div[name="SIGNUP_FORM_LABEL"]:contains("Tell Us About Your Project") {
  min-width: 75% !important;
  white-space: nowrap !important;
}
div[name="SIGNUP_FORM_LABEL"] {
  min-width: 130px;
  white-space: nowrap;
}

/* ==== Font Styling: 18px Heebo ==== */
div[name="SIGNUP_FORM_LABEL"],
#SIGNUP_BODY,
#SIGNUP_PAGE,
#REQUIRED_FIELD_TEXT {
  font-family: 'Heebo', sans-serif !important;
  font-size: 18px !important;
}
.zcinputbox input,
.zcinputbox textarea {
  font-family: 'Heebo', sans-serif !important;
  font-size: 18px !important;
}
#zcWebOptin {
  font-family: 'Heebo', sans-serif !important;
  font-size: 18px !important;
}

/* ==== Reduce space between heading underline and form ==== */
#signupMainDiv {
  margin-top: 0px !important;
}
#SIGNUP_PAGE > br {
  display: none !important;
}

@media screen and (max-width: 480px) {
  h2 {
    font-size: 3.25rem !important; 
  }
}

@media screen and (max-width: 550px) {
  .wp-block-site-logo img {
    max-width: 150px !important;
  }
}

@media screen and (max-width: 550px) {
  a.gb-text {
    font-size: 1.25rem !important;
		margin: 0px 15px 15px 15px;
  }
}

/* ===== Two-column layout for the checkbox list ===== */
#selectMailingLists #listRelTable {
  width: 100%;
  border-collapse: separate; /* keep spacing sane */
}
#selectMailingLists #listRelTable tr {
  display: inline-block;      /* let rows wrap like cards */
  width: 50%;                 /* two columns */
  box-sizing: border-box;
  vertical-align: top;
  padding-right: 8px;         /* small gutter between columns */
}
#selectMailingLists #listRelTable td {
  width: 100%;
  display: block;             /* ensure full width inside the "card" */
}

/* Make it a single column on small screens */
@media (max-width: 640px) {
  #selectMailingLists #listRelTable tr {
    width: 100%;
    padding-right: 0;
  }
}

/* Optional niceties for the list items */
#selectMailingLists label div {
  border: 1px solid transparent;
  border-radius: 12px;
  transition: border-color .15s ease, background-color .15s ease;
}
#selectMailingLists label div:hover {
  border-color: #3a3a3a;
  background-color: rgba(255,255,255,0.04);
}

/* ===== Turn asterisks and the helper key yellow ===== */
/* Inline styles from the embed set these red, so use !important to override */
[name="SIGNUP_REQUIRED"] {
  color: #FCEE21 !important;  /* warm yellow */
}
#REQUIRED_FIELD_TEXT {
  color: #FCEE21 !important;
}
/* Match "What type of sign..." text to other form labels */
#selectMailingLists div[name="SIGNUP_FORM_LIST"] {
  font-family: Heebo !important;
  font-size: 20px !important;
  color: #ffffff !important;
  text-align: left !important;
  margin-top: 5px !important;
  margin-bottom: 10px !important;
	font-weight: bold !important;
}
/* Remove top padding from the form wrapper */
#SIGNUP_HEADING {
  padding-top: 0 !important;
	display: none;
}

#SIGNUP_PAGE div#imgBlock {
	display: none;
}