[Share] Search Page Header Color

Some CSS code to change Search Page Header Color

First, you need to add this code to Website Tools > Code Injection > Footer

<script>
if (document.location.pathname.indexOf("/search") == 0) {
    document.querySelector('body').classList.add('t-search')
}
  </script>

Next, to change Header Color, use these corresponding code to Website Tools > Custom CSS

Search - Header Background

body.t-search {
/* header color */
header#header {
    background-color: #f1f2f3 !important;
}}

Navigation Text Color

body.t-search {
/* navigation items */
header#header div.header-nav-item>a {
    color: #f1f !important;
}}

Header Social Icons

/* Social Icons */
body.t-search header#header [class*="social"] svg {
    fill: #f1f;
}

Cart Icon

/* Cart icon */
body.t-search header#header [class*="cart"] svg {
    fill: #f1f;
    stroke: #f1f !important;
}

Cart Quantity text

/* Cart quantity */
body.t-search header#header span.sqs-cart-quantity {
    color: #f1f;
}

Header Button

/* Buttons */
body.t-search header#header a.btn {
    background-color: black !important;
    color: white !important;
}

Burger Icon

/* Burger Icon */
body.t-search header#header .burger-inner>div {
    background-color: #f1f !important;
}
/* Burger X Close icon */
body.t-search.header--menu-open header#header .burger-inner>div {
    background-color: #f1f !important;
}

Login text

/* Login text */
body.t-search header#header [class*="auth"] {
    color: #f1f !important;
}