/*
Theme Name: Divi Child
Template: Divi
*/
/* ========================================= */
/* Start of Pulse Glow Animation for Button  */
/* ----------------------------------------- */
/* This keyframe creates a pulsing glow effect
   for the "Let's Connect" button used globally */
/* ========================================= */

@keyframes pulse-glow {
  0% {
    box-shadow: 0 0 15px rgba(0, 123, 255, 0.5);
  }
  50% {
    box-shadow: 0 0 30px rgba(0, 123, 255, 0.8);
  }
  100% {
    box-shadow: 0 0 15px rgba(0, 123, 255, 0.5);
  }
}

/* ========================================= */
/* End of Pulse Glow Animation for Button    */
/* ========================================= */


/* ========================================= */
/* Header with Lines on Either Side           */
/* ----------------------------------------- */
/* This CSS adds white lines on both sides of */
/* a header, centered with the text. This is  */
/* optimized for a grey background.           */
/* ========================================= */

.header-with-lines {
  display: flex; /* Enables flexbox to align items */
  align-items: center; /* Vertically center the lines and text */
  justify-content: center; /* Horizontally center the entire content */
}

.header-with-lines::before,
.header-with-lines::after {
  content: ''; /* Adds an empty content box for the lines */
  flex: 1; /* Makes the lines grow and take up available space */
  border-bottom: 1px solid #fff; /* White lines, visible on grey background */
  margin: 0 10px; /* Adds space between the lines and the text */
}

.header-with-lines::before {
  margin-right: 10px; /* Controls the spacing before the text */
}

.header-with-lines::after {
  margin-left: 10px; /* Controls the spacing after the text */
}

/* ========================================= */
/* End of Header with Lines on Either Side    */
/* ========================================= */


/* ========================================= */
/* Donut Chart Segments on Mortgage Calculator*/
#mc_principal {
  stroke: #692319; /* Rust color for Principal & Interest segment */
}

#mc_insurance {
  stroke: #e09900; /* Yellow ochre color for Home Insurance segment */
}

#mc_propertytax {
  stroke: #252222; /* Warm black color for Property Tax segment */
}

#mc_hoafees {
  stroke: #000000; /* Black color for HOA Fees segment */
}

/* Labels for Chart Segments */
#principal_label {
  background-color: #692319; /* Rust background for Principal & Interest label */
  color: #ffffff; /* White text */
}

#insurance_label {
  background-color: #e09900; /* Yellow ochre background for Home Insurance label */
  color: #ffffff; /* White text */
}

#propertytax_label {
  background-color: #252222; /* Warm black background for Property Tax label */
  color: #ffffff; /* White text */
}

#hoafees_label {
  background-color: #000000; /* Black background for HOA Fees label */
  color: #ffffff; /* White text */
}
/* End Donut Chart Segments on Mortgage Calculator*/
/* ========================================= */

/* === BEGIN: Prevent button columns from stacking on mobile in two-button-row === */
@media (max-width: 767px) {
  .two-button-row .et_pb_column {
    width: 50% !important;
    display: inline-block !important;
    vertical-align: middle;
    text-align: center;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}
/* === END: Prevent button columns from stacking on mobile in two-button-row === */
/* ==========================================================================
   Contact Form-specific success message styles
   ========================================================================== */

/* White success text for dark background form */
.contact-form-dark .et-pb-contact-message p {
  color: #ffffff !important;
}

/* Black success text for light background form */
.contact-form-light .et-pb-contact-message p {
  color: #000000 !important;
}

/* Optional: style error messages if needed */
.contact-form-dark .et-pb-contact-message ul,
.contact-form-light .et-pb-contact-message ul {
  color: red !important;
}