/* * Light theme overrides for blades.co.uk. * Enqueued by light-theme.php only when the light theme is active * (currently pjsmark only - see blades_light_theme_active()). * * Most dark styling switches off automatically because the dark-only rules in * Customizer > Custom CSS are scoped under `.dark` and the dark Flatsome theme * mods are filtered per-request. This file covers things that need explicit * light replacements: FiboSearch (its colours are global plugin settings), * hard-coded inline colours, and rules that lost their dark counterpart. */ /* ------------------------------------------------------------------ * FiboSearch - plugin settings are dark; override for light mode. * !important is needed to beat the plugin's inline CSS. * ------------------------------------------------------------------ */ /* Search input */ body.light .dgwt-wcas-search-wrapp .dgwt-wcas-search-input, body.light .dgwt-wcas-sf-wrapp input[type="search"].dgwt-wcas-search-input { background-color: #ffffff !important; border-color: #cccccc !important; color: #333333 !important; } /* Plugin sets placeholder to #fff at opacity .3 - override both */ body.light .dgwt-wcas-sf-wrapp input[type="search"].dgwt-wcas-search-input::placeholder, body.light .dgwt-wcas-search-wrapp .dgwt-wcas-search-input::placeholder { color: #6d6d6d !important; opacity: 1 !important; } body.light .dgwt-wcas-sf-wrapp input[type="search"].dgwt-wcas-search-input::-webkit-input-placeholder { color: #6d6d6d !important; opacity: 1 !important; } body.light .dgwt-wcas-sf-wrapp input[type="search"].dgwt-wcas-search-input:-ms-input-placeholder { color: #6d6d6d !important; } /* Input underlay / preloader area */ body.light .dgwt-wcas-preloader, body.light .dgwt-wcas-search-wrapp .dgwt-wcas-sf-wrapp:before { background-color: #ffffff !important; } /* Submit button (icon stays white - plugin already paints it #fff) */ body.light .dgwt-wcas-search-wrapp .dgwt-wcas-search-submit { background-color: #076bba !important; color: #ffffff !important; } /* Arrow/triangle on the submit button: match the blue button */ body.light .dgwt-wcas-sf-wrapp .dgwt-wcas-search-submit:before, body.light .dgwt-wcas-sf-wrapp .dgwt-wcas-search-submit:hover:before, body.light .dgwt-wcas-sf-wrapp .dgwt-wcas-search-submit:focus:before, body.light .dgwt-wcas-sf-wrapp .dgwt-wcas-search-submit:active:before { border-right-color: #076bba !important; } /* Pirx-style form wrapper behind the input is dark (#1a1a1a) */ body.light .dgwt-wcas-style-pirx .dgwt-wcas-sf-wrapp { background-color: transparent !important; } /* Icons that sit on the white input: close (X), standalone magnifier, loader */ body.light .dgwt-wcas-search-wrapp .dgwt-wcas-close path, body.light .dgwt-wcas-no-submit.dgwt-wcas-search-wrapp .dgwt-wcas-ico-magnifier path { fill: #444444 !important; } body.light .dgwt-wcas-loader-circular-path { stroke: #444444 !important; } /* Suggestions dropdown (appended to , so body.light still matches). The plugin paints every child white via `.dgwt-wcas-suggestion *` etc., so the override must use the same universal selectors. */ body.light .dgwt-wcas-suggestions-wrapp, body.light .dgwt-wcas-details-wrapp { background-color: #ffffff !important; border-color: #dddddd !important; color: #333333 !important; } body.light .dgwt-wcas-suggestions-wrapp *, body.light .dgwt-wcas-details-wrapp *, body.light .dgwt-wcas-sd, body.light .dgwt-wcas-suggestion * { color: #333333 !important; } body.light .dgwt-wcas-suggestion { color: #333333 !important; border-color: #eeeeee !important; } body.light .dgwt-wcas-suggestions-wrapp, body.light .dgwt-wcas-details-wrapp, body.light .dgwt-wcas-suggestion, body.light .dgwt-wcas-datails-title, body.light .dgwt-wcas-details-more-products { border-color: #e0e0e0 !important; } body.light .dgwt-wcas-suggestion.dgwt-wcas-suggestion-focus, body.light .dgwt-wcas-suggestion:hover, body.light .dgwt-wcas-suggestion-selected { background-color: #f0f0f0 !important; } /* Re-assert accent colours knocked out by the universal override above */ body.light .dgwt-wcas-suggestions-wrapp .dgwt-wcas-st strong, body.light .dgwt-wcas-sd strong, body.light .dgwt-wcas-suggestion .dgwt-wcas-st-highlight { color: #076bba !important; } body.light .dgwt-wcas-suggestions-wrapp span.search-sku, body.light .dgwt-wcas-suggestion span.search-sku { color: #5e5e5e !important; } body.light span.search-stock.search-instock, body.light .dgwt-wcas-suggestion span.search-stock.search-instock, body.light span.fibo-instock, body.light .dgwt-wcas-suggestion span.fibo-instock { color: #119f00 !important; } body.light span.search-stock.search-outofstock, body.light .dgwt-wcas-suggestion span.search-stock.search-outofstock, body.light span.fibo-outofstock, body.light .dgwt-wcas-suggestion span.fibo-outofstock { color: #df5200 !important; } /* Mobile fullscreen search overlay (shared CSS forces #000) */ body.light .dgwt-wcas-overlay-mobile { background: #ffffff !important; } /* Search result prices (dark mode forced these to #000 via .dark rule) */ body.light .search-price span.amount { color: #000000; } /* ------------------------------------------------------------------ * Top bar - the "CALL US" phone link has a hard-coded inline * style="color: #fff;" in the top bar HTML content. * ------------------------------------------------------------------ */ body.light .header-top .pjs-header-callus, body.light .header-top .pjs-header-callus a { color: #111111 !important; } /* ------------------------------------------------------------------ * Light counterparts for rules whose dark versions are scoped * under .dark in Customizer > Custom CSS. * ------------------------------------------------------------------ */ /* Product filter round radio buttons */ body.light .prdctfltr_wc.prdctfltr_round .prdctfltr_filter label>span:before { border: 2px solid #bbbbbb; background-color: #ffffff; } /* Product filter colour swatch blocks */ body.light .prdctfltr_customize_block { border: 1px solid #00000026; } /* Out of stock label on category grids */ body.light .box-image .out-of-stock-label { color: #555555; background: #ffffff; opacity: 0.85; } /* ------------------------------------------------------------------ * Light counterparts for dark-assuming rules in the shared PJS * common CSS (inc/pjs-functions-common-woo.php). * ------------------------------------------------------------------ */ /* Product page notice box: white border/bg is invisible on white */ body.light .prod-message { border-color: #00000045; background-color: #00000010; } /* UK legal notice: dark blue bg needs light text kept */ body.light .productuklegal { color: #ffffff; } /* Affiliate area tables: pale grey text / white borders */ body.light table.affwp-table td, body.light table.affwp-table th { border-color: #00000030; color: #333333; } body.light table.affwp-table th { background-color: #eeeeee; color: #111111; } @media (max-width: 767px) { body.light .affwp-table-responsive td:first-child { background-color: #eeeeee; color: #111111; } }