/* ===== COMOX BIKE CO HEADER STYLING RESET ===== */

/* Whole header wrapper: make it black with white text */
.sePageHeaderWrapper {
  background-color: #000000 !important;
  color: #ffffff !important;
}

/* Any text/links inside the header */
.sePageHeaderWrapper a,
.sePageHeaderWrapper p,
.sePageHeaderWrapper span,
.sePageHeaderWrapper .seUserActionsLabel {
  color: #ffffff !important;
}

/* Top strip + bottom bar (MENU / logo / search) */
.seHeaderTop,
.seHeaderBottom {
  background-color: #000000 !important;
}

/* Bottom header columns (left MENU, logo, right search/actions) */
.seHeaderBottom .seDesktopToggle,
.seHeaderBottom .seSiteLogo,
.seHeaderBottom .seHeaderBottomActions {
  background-color: #000000 !important;
}

/* ===== MENU BUTTON ===== */

/* Reset the MENU buttons (desktop + mobile) */
#wsnavtoggledesktop,
#wsnavtoggle {
  background-color: #000000 !important;
  color: #ffffff !important;
  border: none !important;
  box-shadow: none !important;
  outline: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
}

/* The three bars inside MENU */
#wsnavtoggledesktop .icon-bar,
#wsnavtoggle .icon-bar {
  background-color: #ffffff !important;
}

/* ===== ICONS (store, account, cart, search) ===== */

.sePageHeaderWrapper .seIcon,
.sePageHeaderWrapper i.seIcon {
  color: #ffffff !important;
  fill: #ffffff !important;
}

/* ===== SEARCH BOX ===== */

.seHeaderBottom .seSiteSearch .seSearchBox {
  background-color: transparent !important;
  color: #ffffff !important;
  border-color: #ffffff !important;
}

.seHeaderBottom .seSiteSearch .seSearchBox::placeholder {
  color: #ffffff !important;
}

.seHeaderBottom .seSearchButton {
  background-color: transparent !important;
  border-color: #ffffff !important;
}

.seHeaderBottom .seSearchButton .seIconSearch {
  color: #ffffff !important;
  fill: #ffffff !important;
}

/* ===== Kill any stray borders/outlines in bottom header row ===== */

.seHeaderBottom,
.seHeaderBottom * {
  border-color: #000000 !important;
  outline-color: #000000 !important;
}

/* Add custom top-bar message instead of hours */
.seStoreHours::after {
  content: "Tue–Fri 9:00–5:30 | Sat 9:30–4:30 | Call: 250-339-6683";
  color: #ffffff !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  margin-left: 8px !important;
  display: inline-block !important;
}

/* Hide the original hours */
.seStoreHours p {
  display: none !important;
}