/* Custom layout fixes for Bergen County Roofers */

/* Fix hero section layout */
.elementor-6 .elementor-element-ac90167 {
  min-height: 600px !important;
  padding: 60px 0 !important;
  overflow: visible !important;
  position: relative !important;
  display: block !important;
}

.elementor-6 .elementor-element-ac90167 .elementor-container {
  display: flex !important;
  align-items: stretch !important;
  flex-wrap: nowrap !important;
  gap: 0 !important;
  max-width: 1200px !important;
  margin: 0 auto !important;
}

/* Override default Elementor column widths - CRITICAL FIX */
.elementor-6 .elementor-element-ac90167 .elementor-col-66 {
  width: 60% !important;
  flex: 0 0 60% !important;
  max-width: 60% !important;
}

.elementor-6 .elementor-element-ac90167 .elementor-col-33 {
  width: 40% !important;
  flex: 0 0 40% !important;
  max-width: 40% !important;
}

/* Left column - content */
.elementor-6 .elementor-element-20c636b {
  display: flex !important;
  align-items: center !important;
  padding: 30px !important;
}

.elementor-6 .elementor-element-20c636b .elementor-widget-wrap {
  width: 100% !important;
}

/* Right column - form */
.elementor-6 .elementor-element-b02b952 {
  display: flex !important;
  align-items: center !important;
  padding: 30px !important;
}

.elementor-6 .elementor-element-b02b952 .elementor-widget-wrap {
  width: 100% !important;
  max-width: 450px !important;
  margin: 0 auto !important;
}

/* Form container fixes */
.wpforms-container {
  background: rgba(255, 255, 255, 0.95) !important;
  padding: 30px !important;
  border-radius: 8px !important;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1) !important;
}

.wpforms-field {
  margin-bottom: 15px !important;
}

.wpforms-field input,
.wpforms-field select,
.wpforms-field textarea {
  width: 100% !important;
  padding: 12px !important;
  border: 1px solid #ddd !important;
  border-radius: 4px !important;
  font-size: 14px !important;
  box-sizing: border-box !important;
}

.wpforms-submit-container {
  margin-top: 20px !important;
}

.wpforms-submit {
  width: 100% !important;
  padding: 12px 24px !important;
  background: #4a7c59 !important;
  color: white !important;
  border: none !important;
  border-radius: 4px !important;
  cursor: pointer !important;
  font-size: 16px !important;
  font-weight: 600 !important;
}

.wpforms-submit:hover {
  background: #3d6849 !important;
}

/* Section spacing fixes */
.elementor-section {
  padding: 60px 0 !important;
}

.elementor-inner-section {
  padding: 30px 0 !important;
}

/* Prevent content overflow */
.elementor-container {
  max-width: 1200px !important;
  margin: 0 auto !important;
  padding: 0 15px !important;
  box-sizing: border-box !important;
}

/* Fix column gaps */
.elementor-column-gap-no > .elementor-column > .elementor-element-populated {
  padding: 20px !important;
}

/* Specifically for hero section columns */
.elementor-6
  .elementor-element-ac90167.elementor-column-gap-no
  .elementor-column
  > .elementor-element-populated {
  padding: 30px 20px !important;
}

/* Remove any negative margins */
.elementor-6 .elementor-element-ac90167 .elementor-column {
  margin: 0 !important;
}

/* Fix text alignment in hero */
.elementor-6 .elementor-element-20c636b h1,
.elementor-6 .elementor-element-20c636b h4 {
  margin-bottom: 20px !important;
}

/* Ensure proper z-index for overlapping elements */
.elementor-background-overlay {
  z-index: 0 !important;
}

.elementor-widget-wrap {
  position: relative !important;
  z-index: 1 !important;
}

/* Fix form field spacing */
.wpforms-field-container > div {
  margin-bottom: 15px !important;
}

/* Improve button spacing */
.elementor-button-wrapper {
  margin-top: 20px !important;
}

/* Desktop layout */
@media (min-width: 1025px) {
  .elementor-6 .elementor-element-ac90167 .elementor-container {
    flex-direction: row !important;
    align-items: center !important;
  }

  /* Ensure proper column widths on desktop */
  .elementor-6 .elementor-element-ac90167 .elementor-col-66 {
    width: 60% !important;
    flex: 0 0 60% !important;
    max-width: 60% !important;
  }

  .elementor-6 .elementor-element-ac90167 .elementor-col-33 {
    width: 40% !important;
    flex: 0 0 40% !important;
    max-width: 40% !important;
  }

  /* Ensure columns don't overflow */
  .elementor-6 .elementor-element-ac90167 .elementor-column {
    position: relative !important;
  }
}

/* Tablet layout */
@media (max-width: 1024px) {
  .elementor-6 .elementor-element-ac90167 .elementor-container {
    flex-direction: column !important;
  }

  /* Force full width on tablet */
  .elementor-6 .elementor-element-ac90167 .elementor-col-66,
  .elementor-6 .elementor-element-ac90167 .elementor-col-33 {
    width: 100% !important;
    flex: 0 0 100% !important;
    max-width: 100% !important;
  }

  .elementor-6 .elementor-element-20c636b,
  .elementor-6 .elementor-element-b02b952 {
    flex: 0 0 100% !important;
    max-width: 100% !important;
    width: 100% !important;
  }

  .elementor-6 .elementor-element-20c636b .elementor-widget-wrap,
  .elementor-6 .elementor-element-b02b952 .elementor-widget-wrap {
    text-align: center !important;
  }
}

/* Mobile layout */
@media (max-width: 768px) {
  .elementor-6 .elementor-element-ac90167 {
    min-height: auto !important;
    padding: 40px 0 !important;
  }

  /* Force full width on mobile */
  .elementor-6 .elementor-element-ac90167 .elementor-col-66,
  .elementor-6 .elementor-element-ac90167 .elementor-col-33 {
    width: 100% !important;
    flex: 0 0 100% !important;
    max-width: 100% !important;
  }

  .elementor-6 .elementor-element-20c636b,
  .elementor-6 .elementor-element-b02b952 {
    padding: 20px 15px !important;
    width: 100% !important;
  }

  .wpforms-container {
    padding: 20px !important;
  }

  .elementor-section {
    padding: 40px 0 !important;
  }
}

/* Additional fixes for clean rendering */
* {
  box-sizing: border-box !important;
}

img {
  max-width: 100% !important;
  height: auto !important;
}

/* Fix any floating issues */
.clearfix::after {
  content: "" !important;
  display: table !important;
  clear: both !important;
}

/* Force proper column behavior */
.elementor-6
  .elementor-element-ac90167
  .elementor-column
  > .elementor-widget-wrap {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
}

/* Prevent absolute positioning issues */
.elementor-6 .elementor-element-ac90167 .elementor-column {
  position: relative !important;
}

/* Ensure background overlay doesn't interfere */
.elementor-6 .elementor-element-ac90167 .elementor-background-overlay {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  z-index: 0 !important;
}

/* Make sure content is above overlay */
.elementor-6 .elementor-element-ac90167 .elementor-container {
  position: relative !important;
  z-index: 1 !important;
}

/* Fix form width issues */
.wpforms-form {
  width: 100% !important;
}

/* Better form field styling */
.wpforms-field-label {
  display: none !important;
}

.wpforms-field-container {
  width: 100% !important;
}

/* Improve reCAPTCHA positioning */
.wpforms-recaptcha-container {
  margin: 15px 0 !important;
}

/* Fix checkbox and consent text */
.wpforms-field-checkbox,
.wpforms-field-gdpr-checkbox {
  font-size: 13px !important;
  line-height: 1.5 !important;
}

/* Better heading spacing */
.elementor-heading-title {
  line-height: 1.3 !important;
  margin-bottom: 15px !important;
}

/* CRITICAL: Override any inline width styles from Elementor */
.elementor-6 .elementor-element-ac90167 .elementor-column[style*="width"] {
  width: auto !important;
}

.elementor-6 .elementor-element-ac90167 .elementor-col-66[style*="width"] {
  width: 60% !important;
}

.elementor-6 .elementor-element-ac90167 .elementor-col-33[style*="width"] {
  width: 40% !important;
}

/* Prevent flex-basis inline styles from breaking layout */
.elementor-6 .elementor-element-ac90167 .elementor-column {
  flex-basis: auto !important;
}

.elementor-6 .elementor-element-ac90167 .elementor-col-66 {
  flex-basis: 60% !important;
}

.elementor-6 .elementor-element-ac90167 .elementor-col-33 {
  flex-basis: 40% !important;
}