:root {
  --elynx-gold: #fcb034;
  --elynx-green: #00573d;
  /* Generate filters to produce a given target color: https://codepen.io/sosuke/pen/Pjoqqp */
  --elynx-green-filter: invert(22%) sepia(98%) saturate(574%) hue-rotate(119deg) brightness(94%) contrast(101%);
  /*
  "color-brand" refer to the brand color of the Zoho template, which was #e46317 originally.
  Not all elements are customisable from the Zoho UI (far from it!) so the remaining rules are overridden at the end of this file.
  */
  --color-brand: var(--elynx-gold);
}

/*
Hide style preferences control in header
(Use your browser zoom!)
*/
header li#userPreference {
  display: none;
}

/*
Hide "Sign In" nav link
(TODO: show again when accounts are enabled)
*/
header li#logoutDetails {
  xdisplay: none;
}

/* Hide footer */
footer {
  display: none;
}

/* Recolor category icons and titles */
.KbSubCategoryContainer__subCategoryListContainer .ListHeader__listHeader2.ListHeader__headerType1 .ListHeader__kbSubcategoryImg img {
  filter: var(--elynx-green-filter);
}

.KbSubCategoryContainer__subCategoryListContainer .ListHeader__listHeader2.ListHeader__headerType1 .ListHeader__headerContent h5.ListHeader__header2 a {
  color: var(--elynx-green);
}

.KbSubCategoryContainer__subCategoryListContainer .ListHeader__listHeader2.ListHeader__headerType1 .ListHeader__headerContent h5.ListHeader__header2 a:active,
.KbSubCategoryContainer__subCategoryListContainer .ListHeader__listHeader2.ListHeader__headerType1 .ListHeader__headerContent h5.ListHeader__header2 a:hover {
  color: var(--elynx-gold);
}

/*
Replace brand color with eLynx's gold.
The following rules were copied from the in-page styles on 2023-05-03.
*/
.commonStyle__zt3Link:hover {
  color: var(--color-brand);
}

.themeLink:hover {
  color: var(--color-brand);
}

.commonStyle__zt3LinkActive {
  color: var(--color-brand);
}

.commonStyle__zt3bdrLine {
  border-color: var(--color-brand);
}

.commonStyle__zt3BrandBg {
  background-color: var(--color-brand);
}

.commonStyle__zt3BrandFill {
  fill: var(--color-brand);
}

.commonStyle__zt3Brand {
  color: var(--color-brand);
}

.commonStyle__zt3BrandBorder {
  border-color: var(--color-brand);
}

.commonStyle__zt3breadCrumbText {
  color: #333;
}

.commonStyle__zt3breadCrumbText:hover {
  color: var(--color-brand);
}

.commonStyle__zt3breadCrumbBg {
  background: #f8f8f8;
}

.commonStyle__zt3buttonPrimaryBg {
  background-color: var(--color-brand);
}

.commonStyle__zt3buttonPrimaryText {
  color: #FFF;
}

.commonStyle__zt3buttonSecondaryBg {
  background-color: #f9f9f9;
}

.commonStyle__zt3buttonSecondaryText {
  color: #333;
}

.description .hc_mention {
  color: var(--color-brand);
  font-size: 1rem;
}

.AppContainer__acbty_skip_links a {
  border-color: var(--color-brand);
  outline: solid 0 #f38747; /* TODO: customise? */
}

.AppContainer__keyBoardfocus,
[data-focus-added] {
  outline-color: var(--color-brand) !important; /* was #e0951c */
}

.SearchContainer__downArrow {
  border-top-color: var(--color-brand);
}

.Icon__brand {
  color: var(--color-brand);
}

.Icon__hoverbrand:hover {
  color: var(--color-brand);
}

.SearchList__normal:hover {
  color: var(--color-brand);
  background: #FFF;
}

.Button__search {
  background-color: var(--color-brand);
  color: #FFF;
}

.Button__footerBtn:hover {
  background: var(--color-brand);
}

@media only screen and (min-width:1025px) {
  .Header__tabsTab:hover,
  .Header__homeNavbarFixed .Header__navbar .Header__tabsTab:hover {
    border-bottom-color: var(--color-brand);
    color: var(--color-brand);
  }
}

.Header__tabsTab.Header__active,
.Header__homeNavbarFixed .Header__navbar .Header__tabsTab.Header__active {
  border-bottom-color: var(--color-brand);
  color: var(--color-brand);
}

.globalfixednav .aPlusIcon:hover {
  color: var(--color-brand);
}

.ErrorPage__errorTitle {
  color: var(--color-brand);
}

.CustomizeContainer__aPlus:hover {
  color: var(--color-brand);
}

.LoginDetail__active {
  border-bottom-color: var(--color-brand);
  color: var(--color-brand);
}

@media only screen and (min-width:1025px) {
  .LoginDetail__signup:hover,
  .LoginDetail__signin:hover {
    color: var(--color-brand);
    border-bottom-color: var(--color-brand);
  }

  .globalfixednav .globalSignin:hover,
  .globalfixednav .globalSignup:hover {
    border-bottom-color: var(--color-brand);
    color: var(--color-brand);
  }
}

.globalfixednav .globalLocalText:hover {
  color: var(--color-brand);
}

@media only screen and (min-width: 1025px) {
  .LocalePopup__localeTarget:hover {
    color: var(--color-brand);
  }
}

.KbCategory__topic .KbCategory__deptText:hover {
  color: var(--color-brand);
}

.NoContent__title {
  color: var(--color-brand);
}

.Pagination__nrmalTab:hover,
.Pagination__pgNvRtHv:hover,
.Pagination__pgNvLtHv:hover {
  color: var(--color-brand);
}

.KbDetailLtContainer__articleContent a {
  color: var(--color-brand);
}

.Comment__bestAnswer {
  color: var(--color-brand);
}

.FormElement__mandatoryStar .FormElement__required:after {
  color: var(--color-brand);
}

.TabFilter__tab:hover {
  color: var(--color-brand);
}

.DateTime__sideArows:hover,
.DateTime__datesStr:hover {
  color: var(--color-brand);
  background: #f5f5f5;
}

.DateTime__today {
  background: var(--color-brand);
  color: #FFF;
}

.DateTime__today:hover {
  background: var(--color-brand);
  color: #FFF;
}

.DateTime__blueBut {
  background: var(--color-brand);
  color: #FFF;
  border: 1px solid var(--color-brand);
}

.DateTime__blueBut:hover {
  border: 1px solid var(--color-brand);
  box-shadow: 0 0 1px var(--color-brand);
}

.DropdownComponent__listview {
  box-shadow: 0 0 3px var(--color-brand);
  border-color: var(--color-brand);
  background-color: #FFF;
}

.DropdownComponent__option:hover {
  background: var(--color-brand);
  color: #FFF;
}

.DropdownComponent__bccolor {
  background-color: var(--color-brand);
  color: #FFF;
}

.DateWidget__date:hover {
  border-bottom-color: var(--color-brand);
}

.DateWidget__dateFocus {
  border-bottom-color: var(--color-brand);
  color: #333;
}

.FileUpload__attachLoading {
  border-top-color: var(--color-brand);
}

html[dir="rtl"] .FileUpload__attachLoading {
  border-left-color: var(--color-brand);
}

.MultiSelect__suggestionFocus {
  color: var(--color-brand);
}

.DropDown__option:hover {
  color: var(--color-brand);
  background: #FFF;
}

.Autosuggest__option:hover {
  color: var(--color-brand);
}

.NestedDropDown__option:hover {
  color: var(--color-brand);
  background: #FFF;
}

.FilterTabs__activeFilter {
  color: var(--color-brand);
}