/*
 * Fabify 3D Light Mode Lock v2.2.0 — dark themes -> light surfaces.
 * Runs on every device, even if a dark-mode script reports the OS preference
 * incorrectly or removes its own class after the stylesheet has loaded.
 * No image inversion, universal background reset, or forced-colors override.
 * To keep a deliberately dark UI block, add data-fabify-keep-dark="1".
 */

/* The browser's native controls and automatic darkening opt-out. */
:root,
html.fabify-light-lock,
html.fabify-light-lock body,
html.fabify-light-lock body :is(input,textarea,select,option,button,dialog) {
    color-scheme: light !important;
    color-scheme: only light !important;
}

/* Declare light fallbacks for *dark-mode-only* custom properties used by
 * common WordPress themes. Only activate these tokens on known light shells,
 * never global brand/Elementor tokens (those can control colored sections). */
html.fabify-light-lock body :is(
    #page,#site,#wrapper,#wrap,#content,#primary,#main,#main-content,
    .site,.site-content,.site-main,.content-area,.wp-site-blocks,
    .elementor-location-header,.site-header,.main-header,
    .woocommerce,.woocommerce-page,.wc-block-cart,.wc-block-checkout
) {
    --fabify-force-surface: #fff;
    --fabify-force-text: #243447;
    color-scheme: only light !important;
}

/* Actual page surfaces. Keep gradients/backgrounds inside intentionally
 * designed banners, sliders, buttons and product galleries untouched. */
html.fabify-light-lock--force-all-white body :is(
    #page,#site,#wrapper,#wrap,#main,#main-content,#content,#primary,
    .site,.site-content,.site-main,.content-area,.wp-site-blocks,
    .elementor-location-header,.site-header,.main-header,#masthead,
    .header-inner,.header-wrapper,.mobile-header,.mobile-header-bar
):not([data-fabify-keep-dark="1"]),
html.fabify-light-lock--force-all-white body:is(.dark,.dark-mode,.dark-theme,.night-mode,[data-theme="dark"],[data-bs-theme="dark"]) :is(
    #page,#site,#wrapper,#wrap,#main,#content,.site,.site-content,
    .site-main,.content-area,.wp-site-blocks,.site-header,#masthead
):not([data-fabify-keep-dark="1"]) {
    background-color: #fff !important;
    color-scheme: only light !important;
}

/* Correct sites where an OS-dark theme changes the site document to black
 * even though the root class has been neutralized by JavaScript. */
@media (prefers-color-scheme: dark) {
    html.fabify-light-lock--force-all-white,
    html.fabify-light-lock--force-all-white body {
        background-color: #fff !important;
        background-image: linear-gradient(#fff,#fff) !important;
        color: #243447 !important;
        color-scheme: only light !important;
    }
}

/* Headers, top navigation, flyouts and mobile menu containers. These rules
 * are not restricted to dark media because browser forced-dark often reports
 * a normal light matchMedia result. */
html.fabify-light-lock--force-all-white body :is(
    .site-header,.main-header,#masthead,#site-header,
    .elementor-location-header,.header-inner,.header-wrapper,
    .mobile-header,.mobile-header-bar,.mobile-menu,.mobile-nav,
    .mobile-nav-wrapper,.offcanvas-menu,.off-canvas-menu,
    .offcanvas-body,.offcanvas-header,.menu-modal,.menu-panel,
    .dropdown-menu,.mega-menu,.sub-menu,.elementor-nav-menu--dropdown,
    .elementor-popup-modal .dialog-widget-content,
    .elementor-popup-modal .dialog-message,
    .elementor-popup-modal .dialog-lightbox-widget-content
):not([data-fabify-keep-dark="1"]) {
    background-color: #fff !important;
    color: #243447 !important;
    color-scheme: only light !important;
}
html.fabify-light-lock--force-all-white body :is(
    .site-header,.main-header,#masthead,#site-header,
    .elementor-location-header,.mobile-header,.mobile-menu,.mobile-nav,
    .offcanvas-menu,.off-canvas-menu,.dropdown-menu,.mega-menu,.sub-menu,
    .elementor-nav-menu--dropdown
) :is(
    .menu-item > a,a.menu-item,nav a:not(.button):not(.btn),
    .nav-menu a,.elementor-nav-menu a,.elementor-item,
    .navbar-nav a,.sub-menu a,.site-title,.site-description,
    .menu-toggle:not(.button),.menu-item > span
):not(.button):not(.btn):not(.elementor-button):not(.wp-block-button__link) {
    color: #243447 !important;
    -webkit-text-fill-color: #243447 !important;
}

/* WooCommerce: checkout/payment, cart, account, order summary, notices and
 * popup drawers. Avoid overriding sale badges and checkout buttons. */
html.fabify-light-lock--force-all-white body :is(
    .woocommerce-checkout #payment,.woocommerce-checkout-payment,
    .woocommerce-checkout-review-order,.woocommerce-cart-form,
    .woocommerce table.shop_table,.woocommerce .cart_totals,
    .woocommerce .woocommerce-MyAccount-navigation,
    .woocommerce .woocommerce-MyAccount-content,
    .woocommerce-info,.woocommerce-message,.woocommerce-error,
    .wc-block-cart__main,.wc-block-checkout__main,
    .wc-block-components-sidebar,.wc-block-components-order-summary,
    .wc-block-components-totals-wrapper,
    .wc-block-components-drawer__content,
    .wc-block-components-modal__content,
    .woocommerce-mini-cart,.woocommerce-mini-cart__total,
    .select2-dropdown,.select2-results__options
):not([data-fabify-keep-dark="1"]) {
    color-scheme: only light !important;
    background-color: #fff !important;
    color: #243447 !important;
}
html.fabify-light-lock--force-all-white body :is(
    .woocommerce,.woocommerce-page,.wc-block-cart,.wc-block-checkout,
    .wc-block-components-drawer__content,.select2-dropdown
) :is(label,legend,.wc-block-components-text-input label,
       .woocommerce-form__label,.woocommerce-shipping-fields label,
       .woocommerce-billing-fields label,.woocommerce-checkout-payment label) {
    color: #243447 !important;
    -webkit-text-fill-color: #243447 !important;
}

/* Standard forms, including browser-native autofill widgets. */
html.fabify-light-lock body :is(
    input:not([type="submit"]):not([type="button"]):not([type="reset"]):not([type="range"]):not([type="color"]):not([type="checkbox"]):not([type="radio"]),
    textarea,select,.select2-selection,.select2-search__field,
    .wc-block-components-combobox input,.wc-block-components-text-input input,
    .elementor-field:not(.elementor-field-type-submit)
):not([data-fabify-keep-dark="1"]) {
    background-color: #fff !important;
    color: #243447 !important;
    -webkit-text-fill-color: #243447 !important;
    color-scheme: only light !important;
}
html.fabify-light-lock body :is(input,textarea)::placeholder {
    color: #657487 !important;
    -webkit-text-fill-color: #657487 !important;
    opacity: 1 !important;
}
html.fabify-light-lock body :is(input,textarea,select):-webkit-autofill {
    -webkit-text-fill-color: #243447 !important;
    -webkit-box-shadow: 0 0 0 1000px #fff inset !important;
    box-shadow: 0 0 0 1000px #fff inset !important;
}

/* Other accessible light theme surfaces. WP notices and result dropdowns
 * should not turn black when loaded by AJAX after page render. */
html.fabify-light-lock--force-all-white body :is(
    .search-form,.search-modal,.search-results-dropdown,
    .wp-block-search__inside-wrapper,.wp-block-query,
    .site-search,.elementor-search-form__container,
    .elementor-widget-woocommerce-cart .woocommerce,
    .elementor-widget-woocommerce-checkout-page .woocommerce,
    .woocommerce-MyAccount-content,.woocommerce-account .woocommerce,
    .select2-container--open .select2-dropdown
):not([data-fabify-keep-dark="1"]) {
    background-color: #fff !important;
    color-scheme: only light !important;
}

/* Some night-mode plugins invert the whole document or create a black overlay. */
html.fabify-light-lock--no-auto-dark,
html.fabify-light-lock--no-auto-dark body {
    filter: none !important;
    -webkit-filter: none !important;
    mix-blend-mode: normal !important;
}
html.fabify-light-lock--no-auto-dark body :is(
    .darkmode-layer,.dark-mode-overlay,.wp-dark-mode-overlay,
    .wp-dark-mode-dark-overlay,.darkmode-toggle-layer
) {
    display: none !important;
}

/* Accessibility forced-colors is user-enforced and should remain accessible;
 * do not turn off forced color adjustments or invert images/SVGs. */