/**
 * Plot Insider — Elementor ↔ Blocksy CSS Bridge
 *
 * This file resolves CSS specificity conflicts between Blocksy theme
 * and Elementor page builder. It ensures Blocksy remains the single
 * source of truth for colors and typography across the site.
 *
 * HOW IT WORKS:
 * - Maps Blocksy's --theme-palette-color-N variables → Elementor's --e-global-color-* variables
 * - Scopes Elementor styles so they don't bleed into Blocksy-controlled areas
 * - Forces font inheritance on Elementor pages to respect theme typography
 *
 * SETUP REQUIREMENTS:
 * 1. Go to Elementor > Settings > General
 *    ✅ Check "Disable Default Colors"
 *    ✅ Check "Disable Default Fonts"
 *
 * 2. Go to Elementor Editor > Site Settings > Global Colors
 *    Set Primary = #7FB809, Secondary = #1A1A1A, Text = #333333, Accent = #5A8406
 *
 * 3. Go to Elementor Editor > Site Settings > Global Fonts
 *    Set Primary = Garnett, Secondary = Archivo, Text = Inter, Accent = Inter
 *
 * @package PlotInsider
 * @since   1.0.0
 */


/* ==========================================================================
   1. ROOT VARIABLE MAPPING
   ========================================================================== */

:root {
    /* Elementor colors → Blocksy palette inheritance */
    --e-global-color-primary:   var(--theme-palette-color-1, #7FB809);
    --e-global-color-secondary: var(--theme-palette-color-2, #1A1A1A);
    --e-global-color-text:      var(--theme-palette-color-3, #333333);
    --e-global-color-accent:    var(--theme-palette-color-4, #5A8406);

    /* Elementor typography → Blocksy font inheritance */
    --e-global-typography-primary-font-family:   var(--theme-font-family-headings, 'Garnett', 'Archivo', sans-serif);
    --e-global-typography-secondary-font-family: var(--theme-font-family-headings, 'Archivo', 'Garnett', sans-serif);
    --e-global-typography-text-font-family:      var(--theme-font-family-body, 'Inter', system-ui, sans-serif);
    --e-global-typography-accent-font-family:    var(--theme-font-family-body, 'Inter', system-ui, sans-serif);
}


/* ==========================================================================
   2. PROTECT BLOCKSY HEADER & FOOTER
   ========================================================================== */

/* Prevent Elementor's global colors from bleeding into Blocksy header/footer */
header[data-id],
header[data-header],
[data-header],
.ct-header,
.site-header,
footer[data-id],
footer[data-footer],
[data-footer],
.ct-footer,
.site-footer {
    --e-global-color-primary:   var(--theme-palette-color-1) !important;
    --e-global-color-secondary: var(--theme-palette-color-2) !important;
    --e-global-color-text:      var(--theme-palette-color-3) !important;
    --e-global-color-accent:    var(--theme-palette-color-4) !important;

    --e-global-typography-primary-font-family:   var(--theme-font-family-headings) !important;
    --e-global-typography-text-font-family:      var(--theme-font-family-body) !important;
}

/* Blocksy off-canvas mobile menu — prevent Elementor color contamination */
#offcanvas,
.ct-panel,
.ct-drawer {
    --e-global-color-primary:   var(--theme-palette-color-1) !important;
    --e-global-color-text:      var(--theme-palette-color-3) !important;
}


/* ==========================================================================
   3. ELEMENTOR WIDGET FONT INHERITANCE
   ========================================================================== */

/* Force Elementor text widgets to respect theme body font */
.elementor-widget-text-editor {
    font-family: var(--theme-font-family-body, 'Inter', system-ui, sans-serif);
    line-height: 1.65;
    color: var(--theme-palette-color-3, #333333);
}

/* Force Elementor heading widgets to respect theme heading font */
.elementor-widget-heading .elementor-heading-title {
    font-family: var(--theme-font-family-headings, 'Garnett', 'Archivo', sans-serif);
    color: var(--theme-palette-color-2, #1A1A1A);
}

/* Elementor buttons → brand green */
.elementor-widget-button .elementor-button {
    font-family: 'Archivo', 'Garnett', sans-serif;
    font-weight: 600;
    letter-spacing: 0.02em;
}


/* ==========================================================================
   4. ELEMENTOR SECTION/CONTAINER DEFAULTS
   ========================================================================== */

/* Ensure Elementor sections inherit proper text color */
.elementor-section,
.e-con {
    color: var(--theme-palette-color-3, #333333);
}

/* Elementor links follow brand green */
.elementor a:not(.elementor-button) {
    color: var(--theme-palette-color-1, #7FB809);
}

.elementor a:not(.elementor-button):hover {
    color: var(--theme-palette-color-4, #5A8406);
}


/* ==========================================================================
   5. ELEMENTOR FORM WIDGET HARMONY
   ========================================================================== */

/* Style Elementor forms to match Blocksy's form styling */
.elementor-form .elementor-field-group .elementor-field {
    font-family: var(--theme-font-family-body, 'Inter', system-ui, sans-serif);
    border: 1px solid var(--theme-palette-color-5, #E8E8E8);
    border-radius: 4px;
}

.elementor-form .elementor-field-group .elementor-field:focus {
    border-color: var(--theme-palette-color-1, #7FB809);
    outline: none;
    box-shadow: 0 0 0 2px rgba(127, 184, 9, 0.15);
}

.elementor-form .elementor-button[type="submit"] {
    background-color: var(--theme-palette-color-1, #7FB809) !important;
    font-family: 'Archivo', 'Garnett', sans-serif;
    font-weight: 600;
    border-radius: 4px;
    transition: background-color 0.2s ease;
}

.elementor-form .elementor-button[type="submit"]:hover {
    background-color: var(--theme-palette-color-4, #5A8406) !important;
}


/* ==========================================================================
   6. ELEMENTOR NAV MENU WIDGET
   ========================================================================== */

/* If Elementor Nav Menu is used on static pages */
.elementor-nav-menu a {
    font-family: var(--theme-font-family-body, 'Inter', system-ui, sans-serif) !important;
}

.elementor-nav-menu--main .elementor-item.elementor-item-active {
    color: var(--theme-palette-color-1, #7FB809) !important;
}


/* ==========================================================================
   7. Z-INDEX SAFETY
   ========================================================================== */

/* Ensure Blocksy sticky header stays above Elementor sections */
header[data-header][data-sticky] {
    z-index: 1000 !important;
}

/* Elementor popups should clear the header */
.elementor-popup-modal {
    z-index: 1100 !important;
}