/* ================= HEADER + NAV ================== */

/* Header background - soft warm beige */
#masthead,
#masthead.site-header,
#masthead .header-nav-box,
.site-header,
.site-header.sticky-header {
  background-color: #F3E1DC !important;
  transition: none !important;
  box-shadow: none !important;
  border: none !important;
}

/* Readable text */
#masthead .site-title a,
#masthead .site-description,
#masthead .header-nav-box a {
  color: #333 !important;
}

/* Spread menu links equally */
#masthead .header-nav-box .row.py-3 {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

/* Logo and menu containers */
#masthead .header-nav-box .row.py-3 > div:first-child {
  flex: 0 0 auto;
}
#masthead .header-nav-box .row.py-3 > div:last-child {
  flex: 1;
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  gap: 20px;
}

/* Menu links */
#masthead .header-nav-box a {
  flex: 1;
  text-align: center;
  padding: 10px 0;
  font-weight: 600;
  text-decoration: none;
  color: #333 !important;
}

/* Mobile responsive */
@media (max-width: 768px) {
  #masthead .header-nav-box .row.py-3 {
    flex-direction: column;
  }
  #masthead .header-nav-box .row.py-3 > div:last-child {
    flex-direction: column;
    width: 100%;
  }
  #masthead .header-nav-box a {
    flex: none;
    width: 100%;
  }
}

/* Spacing between menu items */
#menu-ngo_main_primary-menu > li {
  margin: 0 30px;
}

/* ================= LEARN MORE BUTTONS ================== */

div.cause_btn a,
div.cause_btn a.px-3,
.cause_btn .px-3.py-2 {
  background: #C97D7D !important; /* main muted rose */
  color: #fff !important;
  border: none !important;
  border-radius: 20px !important;
  padding: 10px 18px !important;
  font-weight: 600;
}

div.cause_btn a:hover,
div.cause_btn a.px-3:hover,
.cause_btn .px-3.py-2:hover {
  background: #A35E5E !important; /* darker hover */
  color: #fff !important;
}

/* Hide pseudo elements */
div.cause_btn a::before,
div.cause_btn a::after {
  display: none !important;
}

/* ================= FORMS (Volunteer + Contact) ================== */

form.wpcf7-form {
  background: #FFF8F5; /* soft peachy white */
  padding: 30px;
  border-radius: 16px;
  box-shadow: 0 4px 15px rgba(0,0,0,0.08);
  max-width: 600px;
  margin: 30px auto;
  font-family: "Poppins", Arial, sans-serif;
  color: #444;
}

/* Form headings */
form.wpcf7-form h2,
form.wpcf7-form h3 {
  text-align: center;
  font-size: 1.6rem;
  margin-bottom: 20px;
  color: #C97D7D;
  font-weight: 600;
}

/* Inputs */
form.wpcf7-form input[type="text"],
form.wpcf7-form input[type="email"],
form.wpcf7-form input[type="tel"],
form.wpcf7-form textarea {
  width: 100%;
  padding: 12px 14px;
  border: 2px solid #E7C2C2;
  border-radius: 10px;
  background: #fff;
  font-size: 1rem;
  margin-bottom: 15px;
  transition: 0.3s ease;
}

form.wpcf7-form input:focus,
form.wpcf7-form textarea:focus {
  border-color: #C97D7D;
  box-shadow: 0 0 5px rgba(201,125,125,0.3);
}

/* Submit button */
form.wpcf7-form input[type="submit"] {
  background: #C97D7D !important;
  color: #fff !important;
  font-size: 1.1rem;
  font-weight: 600;
  border: none;
  padding: 12px 25px;
  border-radius: 50px;
  cursor: pointer;
  transition: all 0.3s ease;
}

form.wpcf7-form input[type="submit"]:hover {
  background: #A35E5E !important;
}
/* ================= CONTACT US SECTION (Cleaned Up) ================== */

/* Remove background from wrapper */
.wpcf7-form,
.contact-form-wrapper {
  background: transparent !important;
  box-shadow: none !important;
  border: none !important;
  padding: 0 !important;
}

/* Contact form main box */
.contact-section-form {
  background: #F7E4E1 !important; /* soft peach background */
  border-radius: 20px !important;
  padding: 40px !important;
  box-shadow: 0 6px 18px rgba(0,0,0,0.08) !important;
  border: none !important;
  max-width: 700px;
  margin: 0 auto;
}

/* Form Inputs inside contact section */
.contact-section-form input[type="text"],
.contact-section-form input[type="email"],
.contact-section-form input[type="tel"],
.contact-section-form input[type="date"],
.contact-section-form textarea {
  width: 100%;
  background: #fff !important;
  border: 2px solid #C97D7D !important;
  border-radius: 12px !important;
  padding: 12px 15px !important;
  margin-bottom: 18px !important;
  font-size: 1rem;
  color: #3A2E2E !important; /* dark readable text */
  transition: 0.3s ease;
  font-family: "Poppins", sans-serif;
}

.contact-section-form input:focus,
.contact-section-form textarea:focus {
  border-color: #C05A73 !important;
  box-shadow: 0 0 6px rgba(192,90,115,0.35);
}

/* Contact Us Button */
.contact-section-form input[type="submit"],
.contact-section-form button[type="submit"] {
  background: #C05A73 !important; /* muted rose */
  color: #fff !important;
  font-weight: 600 !important;
  font-size: 1.1rem !important;
  padding: 14px 30px !important;
  border: none !important;
  border-radius: 50px !important;
  cursor: pointer !important;
  transition: all 0.3s ease !important;
  display: inline-block !important;
  box-shadow: 0 4px 12px rgba(192,90,115,0.3) !important;
}

.contact-section-form input[type="submit"]:hover,
.contact-section-form button[type="submit"]:hover {
  background: #A14D5F !important; /* darker rose on hover */
  transform: translateY(-3px);
  box-shadow: 0 6px 14px rgba(161,77,95,0.4) !important;
}

/* Text inside form */
.contact-section-form label,
.contact-section-form p,
.contact-section-form span {
  color: #3A2E2E !important; /* dark text for readability */
  font-family: "Poppins", sans-serif;
}




/* ================= PRODUCT / DONATION BUTTON ================== */

form.cart:first-of-type button.single_add_to_cart_button.button.alt {
  background: linear-gradient(135deg, #C97D7D, #A35E5E) !important;
  color: #fff !important;
  font-weight: 600 !important;
  padding: 14px 32px !important;
  border-radius: 50px !important;
  box-shadow: 0 4px 12px rgba(163,94,94,0.3) !important;
  transition: all 0.3s ease !important;
}

form.cart:first-of-type button.single_add_to_cart_button.button.alt:hover {
  background: linear-gradient(135deg, #A35E5E, #8B4747) !important;
  transform: translateY(-3px) scale(1.02) !important;
}

/* ================= ABOUT US JOIN BUTTON ================== */

.abt-join-btn {
  background-color: #C97D7D !important;
  color: #fff !important;
  border-radius: 6px !important;
  transition: all 0.3s ease-in-out !important;
}

.abt-join-btn:hover {
  background-color: #A35E5E !important;
  color: #fff !important;
}