/* Make the "Support" word in the header NOT bold */
.Header__logotxt,
header .Header__logotxt,
.hc-header .Header__logotxt {
  font-weight: 400 !important;                 /* 300 = lighter, 500 = semi-bold */
  font-variation-settings: "wght" 400 !important;  /* for variable fonts */
}
/* Align the logo vertically with the "Support" text */

/* 1) Make the brand area a flex row so items share a baseline */
.hc-header .navbar .navbar-brand,
header .navbar .navbar-brand,
.hc-header .navbar-brand,
header .navbar-brand {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

/* 2) Ensure the text sits tightly */
.Header__logotxt { line-height: 1 !important; }

/* 3) Nudge the logo up a few pixels (covers img, svg, or a logo div) */
.hc-header .navbar-brand img,
.hc-header .navbar-brand svg,
.hc-header .navbar-brand .logo,
.hc-header .navbar-brand .Header__logo,
header .navbar-brand img,
header .navbar-brand svg,
header .navbar-brand .logo,
header .navbar-brand .Header__logo {
  display: inline-block !important;
  vertical-align: middle !important;
  position: relative !important;
  top: -4px !important;            /* tweak: -2px to -8px as needed */
  height: auto !important;         /* keep natural size unless you want to force a size */
  max-height: 28px !important;     /* optional; adjust to match text */
}

/* If your logo is injected as a background on a span/div */
.Header__logo,
.Header__logoWrapper {
  position: relative !important;
  top: -5px !important;            /* same nudge */
  display: inline-block !important;
  vertical-align: middle !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
}

/* Hide the "Powered by Zoho Desk" block */
#footer.Footer__footer > span,
#footer.Footer__footer > a.Footer__footerLink { 
  display: none !important; 
}

/* Search input */
#autoSearchContainer,
input#autoSearchContainer,
#autoSearchContainer:disabled {
  background: #141416 !important;
  color: #CECECE !important;
  border: 1px solid #CECECE !important;
  box-shadow: none !important;
}

/* Placeholder */
#autoSearchContainer::placeholder {
  color: #CECECE !important;
  opacity: 1 !important;
}

/* The wrapper that draws the default light background/border */
.SearchBox__searchTextbox,
#searchContainer1,
.SearchBox__searchpart {
  background: #141416 !important;
  border: 1px solid #CECECE !important;
  border-radius: 4px !important;   /* optional; remove if you prefer square */
}

/* 0) Strip any existing borders/shadows so they don't bulk up the edge */
#autoSearchContainer,
#searchContainer1,
.SearchBox__searchpart,
.SearchBox__searchTextbox,
.SearchCon__searchCon {
  border: 0 !important;
  box-shadow: none !important;
  outline: none !important;
  background: #141416 !important; /* your bg */
  color: #CECECE !important;       /* input text */
}
#autoSearchContainer::placeholder { color: #CECECE !important; opacity: 1 !important; }

/* 1) Draw a clean 1pt border using a pseudo-element overlay */
.SearchCon__searchCon {
  position: relative !important;
  border-radius: 4px !important; /* optional */
}

/* This guarantees a consistent 1pt border regardless of inner wrappers */
.SearchCon__searchCon::after {
  content: "";
  position: absolute;
  inset: 0;                       /* top/right/bottom/left: 0 */
  pointer-events: none;
  border: 1pt solid #CECECE;      /* <-- your exact width & color */
  border-radius: inherit;
}

/* Keep the same look on hover/focus */
.SearchCon__searchCon:hover,
.SearchCon__searchCon:focus-within { background: #141416 !important; }

/* Hide the breadcrumb/menu strip under the search bar */

/* 1) Kill the items themselves (your DOM shows data-id like "_breadcrumb_0") */
[data-id^="_breadcrumb_"],
[id^="breadcrumb_"],
[aria-current="page"][data-id^="_breadcrumb_"] {
  display: none !important;
}

/* 2) Hide common breadcrumb containers (safe within the content area) */
.hc-content [class*="bread"],
.hc-content [id*="bread"],
.page [class*="bread"],
.page [id*="bread"] {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

/* 3) If the strip still shows, hide the whole bar immediately below the header */
.hc-header + div[class],
header + div[class] {
  /* comment this back out if it hides something you want */
  /* display: none !important; */
}

/* === Open Ticket pill: lighter text + no white corners === */

/* The wrapper sometimes adds a subtle white bg/shadow */
.Header__panelbtns,
.Header__panelbtns * {
  background-image: none !important;
  box-shadow: none !important;
}

/* Base button */
.Header__panelbtns a,
.Header__panelbtns button {
    /* change this ↓ */
  border-radius: 0px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  min-height: 50px !important;
  min-width: 140px !important;
  padding: 10px 22px !important;

  background: #CE5179 !important;
  border: 1px solid #CE5179 !important;
  border-radius: 0px !important;        /* less rounded → hides white corners */
  background-clip: padding-box !important;
  overflow: hidden !important;           /* trims any inner bleed */
  outline: none !important;
  box-shadow: none !important;
  appearance: none !important;
  -webkit-appearance: none !important;

  color: #000 !important;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
  font-size: 18px !important;
  line-height: 1 !important;
  font-weight: 400 !important;          /* <- not bold */
  letter-spacing: .1px !important;
}

/* Some themes add extra decorations with ::before — remove them */
.Header__panelbtns a::before,
.Header__panelbtns button::before {
  content: none !important;
  display: none !important;
}

/* Hide built-in label + icon so we control layout */
.Header__panelbtns a span,
.Header__panelbtns button span,
.Header__panelbtns a svg,
.Header__panelbtns button svg,
.Header__panelbtns a i,
.Header__panelbtns button i { display: none !important; }

/* Our visual label — explicit normal weight */
.Header__panelbtns a::after,
.Header__panelbtns button::after {
  content: "Open Ticket";
  color: inherit;
  font-weight: 400 !important;          /* ensure not bold */
}

/* Hover / focus */
.Header__panelbtns a:hover,
.Header__panelbtns a:focus,
.Header__panelbtns button:hover,
.Header__panelbtns button:focus {
  background: #141416 !important;
  border-color: #CECECE !important;
  color: #CECECE !important;
  outline: none !important;
  box-shadow: none !important;
}

/* Remove the underline under the selected/hovered menu item */
#headerContainer nav a,
#headerContainer .Header__menulist a,
#headerContainer .Header__tabs a,
#headerContainer .Header__nav a {
  text-decoration: none !important;
  border-bottom: 0 !important;
  box-shadow: none !important;          /* some themes use inset shadow as line */
}

/* Kill pseudo-element underline bars (active/hover) */
#headerContainer nav a::after,
#headerContainer .Header__menulist a::after,
#headerContainer .Header__tabs a::after,
#headerContainer .Header__nav a::after,
#headerContainer nav li.active > a::after,
#headerContainer .Header__menulist li.active > a::after,
#headerContainer .Header__tabs li.active > a::after {
  content: none !important;
  background: transparent !important;
  height: 0 !important;
}

/* Also remove any bottom border specifically on active item */
#headerContainer nav li.active > a,
#headerContainer .Header__menulist li.active > a,
#headerContainer .Header__tabs li.active > a {
  border-bottom: 0 !important;
  box-shadow: none !important;
}

/* === 1) Make the top menu/header stick to the top === */
#headerContainer,
header.Header__header {
  position: sticky !important;   /* modern browsers */
  top: 0 !important;
  z-index: 1003 !important;      /* above the search bar */
  background: #141416 !important;
  width: 100% !important;
}

/* Fallback for older browsers: force fixed */
@supports not (position: sticky) {
  #headerContainer,
  header.Header__header {
    position: fixed !important;
    left: 0; right: 0;
  }
}

/* Offset the page content so it doesn't jump under the fixed header
   (adjust 64px if your header is taller/shorter) */
#layoutContainer,
.Layout__oneColumn,
.hc-content,
.page {
  margin-top: 64px !important;
}

/* === 2) Remove any bottom shadow/gradient at the junction === */
#headerContainer,
header.Header__header,
#headerContainer::after,
header.Header__header::after,
.SearchCon__searchCon,
.SearchCon__searchCon::before,
.SearchCon__searchCon::after {
  box-shadow: none !important;
  border-bottom: 0 !important;
  background-image: none !important;
}

/* If your theme draws a faint divider with a pseudo-element specifically on the header */
header.Header__header::before {
  content: none !important;
}

/* If a thin line still shows just below the search bar, kill it too */
#searchContainer1,
.SearchBox__searchpart,
.SearchBox__searchTextbox {
  box-shadow: none !important;
  border-bottom: 0 !important;
}
/* Kill the “Are you an Agent?” card completely */
.Signin__agentlogin { display: none !important; }

/* S/* 1) Tighten internal spacing so the panel feels shorter */
.portalContainer.signin .Signin__details,
.portalContainer.signin .Signin__part,
.portalContainer.signin .Signin__signPart,
.portalContainer.signin .Signin__wrapper {
  margin-bottom: -200px !important;
  padding-bottom: 6px !important;    /* drop to 4px if you like */
}