/* =============================================================================
   FINCHAT HUB — ELEMENTOR COMPATIBILITY
   Neutralise conflicts between theme CSS and Elementor widget defaults.
   ============================================================================= */

/* Reset Elementor's section padding so our section padding takes effect */
.elementor-section.elementor-section-boxed > .elementor-container {
  max-width: var(--container-max);
}

/* Prevent Elementor from collapsing our custom sections */
.elementor-element .hero,
.elementor-element .stats-bar,
.elementor-element .how-it-works,
.elementor-element .service-categories,
.elementor-element .features,
.elementor-element .lead-marketplace,
.elementor-element .testimonials,
.elementor-element .cta-banner {
  padding-block: var(--section-py);
}

/* Typography passthrough — let Elementor inherit theme fonts */
.elementor-widget-heading .elementor-heading-title { font-family: var(--font-display); }
.elementor-widget-text-editor p { font-family: var(--font-body); }

/* Elementor button override — map to theme style */
.elementor-widget-button .elementor-button {
  font-family: var(--font-display) !important;
  font-weight: 600 !important;
  border-radius: var(--radius-pill) !important;
  transition: background-color var(--transition-fast), transform var(--transition-fast) !important;
}

/* Elementor colour variables — these are set in the Global Colours panel
   and echo the CSS custom properties defined in main.css */
:root {
  --e-global-color-primary:    var(--fc-red);
  --e-global-color-secondary:  var(--fc-black);
  --e-global-color-text:       var(--fc-black);
  --e-global-color-accent:     var(--fc-red-dark);
}

/* Fix: Elementor icon box icon colour */
.elementor-icon-box-icon .elementor-icon { color: var(--fc-red) !important; }

/* Fix: Elementor column gap in our grid sections */
.elementor-column-gap-default > .elementor-column > .elementor-element-populated {
  padding: 0;
}

/* Avoid Elementor overriding sticky header */
.elementor-sticky--active { z-index: 1001 !important; }

/* Elementor editor — make sure custom sections are visible in canvas */
.elementor-editor-active .site-header { position: relative !important; }
.elementor-editor-active .site-header.is-transparent { background: rgba(13,13,13,0.9) !important; }