/**
 * Neutralise Hello Elementor theme reset.css
 * and Elementor accent color inside OE containers.
 *
 * Only loaded when Elementor is active (ELEMENTOR_VERSION defined).
 *
 * Theme reset.css applies:
 *   a              { color: #c36 }          (0,0,1)
 *   a:active/hover { color: #336 }          (0,1,1)
 *   button:focus/hover { background: #c36 } (0,1,1)
 *
 * Fix strategy:
 * 1. Kill Elementor's --e-global-color-accent variable
 *    inside OE containers (prevents red accent color).
 * 2. Use :where() for ZERO specificity resets so any
 *    component class naturally overrides these. Our CSS
 *    loads after the theme, so same-specificity = we win.
 * 3. For specific elements where Elementor plugin CSS
 *    (not just theme) overrides with higher specificity,
 *    use compound selectors in the component CSS file
 *    (e.g. .parent .child button[data-attr]).
 */

/* 1. Kill Elementor accent variable inside OE containers */
[class^="oe-"],
[class*=" oe-"] {
    --e-global-color-accent: var(--oe-color-text) !important;
}

/* 2. Reset theme link maroon (#c36) — zero specificity via :where() */
:where([class^="oe-"], [class*=" oe-"]) a {
    color: inherit;
}

:where([class^="oe-"], [class*=" oe-"]) a:hover,
:where([class^="oe-"], [class*=" oe-"]) a:focus,
:where([class^="oe-"], [class*=" oe-"]) a:active,
:where([class^="oe-"], [class*=" oe-"]) a:visited {
    color: inherit;
}

/* 3. Reset theme button maroon (#c36 bg/border) — zero specificity via :where() */
:where([class^="oe-"], [class*=" oe-"]) button {
    background-color: transparent;
    border-color: transparent;
    color: inherit;
}

:where([class^="oe-"], [class*=" oe-"]) button:hover,
:where([class^="oe-"], [class*=" oe-"]) button:focus,
:where([class^="oe-"], [class*=" oe-"]) button:active {
    background-color: transparent;
    border-color: transparent;
    color: inherit;
}
