/* ============================================================
   myHR Advocate Portal - Custom CSS v4
   Colors: Navy #2b5170 | Gold #d6a33e | Off-white #f0ece0
   Last updated: April 26, 2026
   ============================================================ */


/* ==================== GLOBAL BACKGROUND ==================== */
body,
.AppContainer__acbtLayout,
#portal_html,
portal body {
  background-color: #f0ece0 !important;
}

.Layout__container,
.Layout__oneColumn {
  background-color: #f0ece0 !important;
  min-height: 0 !important;
  height: auto !important;
}

[id="acbt_layout"] {
  min-height: 0 !important;
}


/* ==================== HEADER ==================== */

.Header__brandName,
[data-id="portal_name"] {
  display: none !important;
}

.Header__headerContainer {
  border-bottom: 3px solid #d6a33e !important;
}

.Header__headerContainer,
#headerRow,
.Header__headerPrimary {
  min-height: 110px !important;
  align-items: center !important;
}

.Header__brandLogo,
.Header__brandLogo img,
[class*="Header__brandLogo"] img {
  height: 130px !important;
  width: auto !important;
  max-height: 130px !important;
  min-height: 130px !important;
}

.Header__menu,
.Header__menu a,
.Header__menu li,
[class*="Header__menu"] a,
[class*="Header__menu"] span,
.commonStyles__headerTxt {
  font-size: 1rem !important;
  font-weight: 600 !important;
}

.Header__browseTrigger,
.Header__browseBtn,
[class*="Header__browse"] {
  display: none !important;
}

.Header__headerSearch,
.Header__searchIcon,
.Header__search,
[class*="Header__search"],
.HeaderBlock__headerblocksearchbox,
.KBHome__searchContainer,
.KBHome__search {
  display: none !important;
}

[data-id="portal_search_icon"],
.Header__listDir {
  display: none !important;
}

/* Hide Tickets nav link */
[data-id="portal_tabCases"] {
  display: none !important;
}


/* ==================== BREADCRUMB NAV ==================== */

[class*="Breadcrumb__"],
[class*="breadcrumb"],
[class*="BreadCrumb__"] {
  font-size: 0.85rem !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
}

[class*="Breadcrumb__"] a,
[class*="BreadCrumb__"] a {
  color: #f5f4f0 !important;
  text-decoration: none !important;
}

[class*="Breadcrumb__"] a:hover,
[class*="BreadCrumb__"] a:hover {
  color: #d6a33e !important;
}

[class*="Breadcrumb__active"],
[class*="BreadCrumb__active"],
[class*="Breadcrumb__current"] {
  color: #d6a33e !important;
}

.HeaderBlock__headerblocktitle,
[class*="HeaderBlock__headerblocktitle"] {
  font-size: 2.2rem !important;
  font-weight: 700 !important;
  color: #2b5170 !important;
  text-align: center !important;
}

.HeaderBlock__headerblocksub,
[class*="HeaderBlock__headerblocksub"] {
  font-size: 1.1rem !important;
  color: #2b5170 !important;
  text-align: center !important;
}

.HeaderBlock__headerblock,
.HeaderBlock__headerblockcont,
[class*="HeaderBlock__"] {
  background-color: #f0ece0 !important;
  border-bottom: none !important;
  padding-bottom: 8px !important;
  margin-bottom: 0 !important;
}

#headerblockbody {
  display: none !important;
}


/* ==================== HIDE LOCKED ZOHO ELEMENTS ==================== */

.PlacardBlock__primary,
[id="placardBlock"],
.PlacardBlock__container,
.PlacardBlock__container1,
.PlacardBlock__title,
.PlacardBlock__body,
.PlacardBlock__cta,
[id="plaCard"],
[class*="PlacardBlock__"] {
  display: none !important;
  height: 0 !important;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
}

.SubmitTicket__submitTicket,
[class*="SubmitTicket__"],
.PlacardBlock__submitticket {
  display: none !important;
}

/* Hide KB book icon on home page only */
[data-id="home"] .ProductModule__moduleCont,
[data-id="home"] .ProductModule__moduleSubCont,
[data-id="home"] [class*="ProductModule__"] {
  display: none !important;
  height: 0 !important;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
}


/* ==================== HOMEPAGE CARD ROW ==================== */

.HomeContainer__drpartMtLt,
.HomeContainer__homeContainer {
  border-top: 2px solid #d6a33e !important;
  border-bottom: 2px solid #d6a33e !important;
  min-height: 0 !important;
  padding-top: 24px !important;
  padding-bottom: 24px !important;
  background-color: #f0ece0 !important;
  margin-bottom: 0 !important;
  display: flex !important;
  justify-content: center !important;
  flex-wrap: nowrap !important;
  gap: 16px !important;
  align-items: stretch !important;
}

/* Mobile - stack cards vertically and center */
@media only screen and (max-width: 768px) {
  .HomeContainer__drpartMtLt,
  .HomeContainer__homeContainer {
    flex-wrap: wrap !important;
    flex-direction: column !important;
    align-items: center !important;
    padding: 16px !important;
    gap: 12px !important;
  }

  .Product__column,
  [class*="Product__column"],
  .HomeContainer__drpartMtLt .Layout__column1,
  .HomeContainer__drpartMtLt > div > div {
    flex: unset !important;
    width: 90% !important;
    min-width: unset !important;
    max-width: 100% !important;
  }
}

.HomeContainer__drpartMtLt::before {
  content: none !important;
  display: none !important;
}

.HomeContainer__minHeight,
[class*="HomeContainer__minHeight"] {
  min-height: 0 !important;
  height: auto !important;
}

.Layout__container[style*="min-height"],
.Layout__oneColumn[style*="min-height"] {
  min-height: 0 !important;
  height: auto !important;
}

[data-id="home"] .Layout__container {
  min-height: 0 !important;
  padding-bottom: 0 !important;
}

/* Gold border on each of the 3 cards */
.Product__column,
[class*="Product__column"] {
  border: 2px solid #d6a33e !important;
  border-radius: 6px !important;
  box-shadow: 0 4px 16px rgba(43, 81, 112, 0.10) !important;
  background: #ffffff !important;
  overflow: hidden !important;
  flex: 1 1 28% !important;
  min-width: 200px !important;
  max-width: 340px !important;
}

.HomeContainer__drpartMtLt .Layout__column1,
.HomeContainer__drpartMtLt [class*="Layout__col"],
.HomeContainer__drpartMtLt > div > div {
  border: 2px solid #d6a33e !important;
  border-radius: 6px !important;
  box-shadow: 0 4px 16px rgba(43, 81, 112, 0.12) !important;
  background: #ffffff !important;
  overflow: hidden !important;
}

.Product__title,
[class*="Product__title"],
h2[data-id*="product_title"] {
  text-align: center !important;
  color: #2b5170 !important;
  font-weight: 700 !important;
  font-size: 0.95rem !important;
}

.Product__description,
[class*="Product__description"] {
  text-align: justify !important;
  color: #555 !important;
  line-height: 1.65 !important;
  font-size: 0.9rem !important;
}


/* ==================== KNOWLEDGE BASE PAGES ==================== */

.KBContainer__KbContainer,
.KBArticle__articleContainer,
.KBCategory__catContainer,
[class*="KBCategory__"] {
  background-color: #f0ece0 !important;
}

.KBArticle__articleTitle,
.KBCategory__catTitle,
.KBHome__categoryTitle {
  color: #2b5170 !important;
}

.KBArticle__articleContent a,
.KBCategory__articleList a {
  color: #2b5170 !important;
}

.KBArticle__articleContent a:hover,
.KBCategory__articleList a:hover {
  color: #d6a33e !important;
}

.CollectionBlurb__threeColumn,
[class*="CollectionBlurb__threeColumn"] {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
  padding: 16px 0 !important;
  border-top: 2px solid #d6a33e !important;
  margin-top: 24px !important;
}

.CollectionBlurb__threeColumn h2,
[class*="CollectionBlurb__"] h2,
[class*="CollectionBlurb__"] > div > h2 {
  color: #2b5170 !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  margin-bottom: 16px !important;
  padding-bottom: 8px !important;
  border-bottom: 1px solid #d6a33e !important;
  display: block !important;
}

.CollectionBlurb__cell,
[class*="CollectionBlurb__cell"] {
  display: block !important;
  background: #f5f4f0 !important;
  border-left: 4px solid #d6a33e !important;
  border-radius: 0 6px 6px 0 !important;
  padding: 10px 16px !important;
  flex: 1 1 28% !important;
  min-width: 180px !important;
}

.CollectionBlurb__title,
[class*="CollectionBlurb__title"] {
  display: block !important;
  color: #2b5170 !important;
  font-weight: 700 !important;
  font-size: 0.85rem !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  text-decoration: none !important;
}

.CollectionBlurb__title:hover,
[class*="CollectionBlurb__title"]:hover {
  color: #d6a33e !important;
}

.CollectionBlurb__body,
[class*="CollectionBlurb__body"] {
  display: block !important;
  color: #888 !important;
  font-size: 0.78rem !important;
  margin-top: 2px !important;
}

[class*="CategoryList__listHead"] {
  min-height: 100px !important;
  display: flex !important;
  flex-direction: column !important;
}

[class*="CategoryList__articleList"],
[class*="CategoryList__listHead"],
.CategoryList__articleList {
  margin-top: 0 !important;
}

[class*="CategoryList__"] .Layout__twoColumn,
[class*="CategoryList__"] [class*="Layout__col"] {
  display: flex !important;
  flex-direction: column !important;
}

[class*="CategoryList__listHead"],
[class*="KBCategory__listHead"] {
  min-height: 80px !important;
}

[class*="KBCategory__"] h2,
[class*="KBCategory__"] h3,
[class*="KBCategory__catTitle"],
[class*="KBCategory__sectionTitle"],
[class*="KBCategory__groupTitle"],
[class*="CategoryList__"] h2,
[class*="CategoryList__"] h3 {
  color: #2b5170 !important;
  font-weight: 700 !important;
  font-size: 0.95rem !important;
  letter-spacing: 0.03em !important;
}

[class*="CategoryList__desc"],
[class*="CategoryList__description"],
[class*="CategoryList__subTitle"],
[class*="KBCategory__desc"],
[class*="KBCategory__description"] {
  display: block !important;
  overflow: visible !important;
  white-space: normal !important;
  -webkit-line-clamp: unset !important;
  -webkit-box-orient: unset !important;
  max-height: none !important;
  color: #666 !important;
  font-size: 0.88rem !important;
  line-height: 1.5 !important;
  margin-bottom: 12px !important;
}

.CategoryList__listLink,
.CategoryList__kbListLink,
[class*="CategoryList__listLink"],
[class*="CategoryList__kbListLink"] {
  color: #2b5170 !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  text-align: left !important;
  flex: 1 !important;
}

.CategoryList__listLink:hover,
.CategoryList__kbListLink:hover,
[class*="CategoryList__listLink"]:hover {
  color: #d6a33e !important;
}

.CategoryList__topicList,
.CategoryList__listItem,
[class*="CategoryList__topicList"],
[class*="CategoryList__listItem"] {
  list-style: none !important;
  background: #f5f4f0 !important;
  border: none !important;
  border-left: 4px solid #d6a33e !important;
  border-radius: 0 6px 6px 0 !important;
  margin-bottom: 8px !important;
  padding: 10px 16px !important;
  box-shadow: 0 2px 6px rgba(43, 81, 112, 0.07) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}

.CategoryList__topicList span[class*="bullet"],
.CategoryList__topicList [class*="CategoryList__bullet"],
[class*="CategoryList__bullet"] {
  display: none !important;
}

.CategoryList__topicList::after,
.CategoryList__listItem::after,
[class*="CategoryList__topicList"]::after,
[class*="CategoryList__listItem"]::after {
  content: '›' !important;
  color: #2b5170 !important;
  font-size: 1.4rem !important;
  font-weight: 700 !important;
  flex-shrink: 0 !important;
  margin-left: 8px !important;
}

.KBHome__categoryCard,
.KBHome__catBlock {
  border-top: 3px solid #d6a33e !important;
  background: #fff !important;
}

.KBProductHeader__infoCont,
[class*="KBProductHeader__infoCont"],
[class*="KBProductHeader__"] {
  border-bottom: none !important;
}

#headerBlock,
.HeaderBlock__headerblock {
  border-bottom: 2px solid #d6a33e !important;
  padding-bottom: 24px !important;
  margin-bottom: 24px !important;
  max-width: 1200px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}


/* ==================== BUTTONS ==================== */

.btn-primary,
[class*="btn-primary"],
.Button__primary {
  background-color: #d6a33e !important;
  border-color: #d6a33e !important;
  color: #2b5170 !important;
  font-weight: 700 !important;
}

.btn-primary:hover,
[class*="btn-primary"]:hover {
  background-color: #b8892f !important;
  border-color: #b8892f !important;
}

.Button__neutral,
[class*="Button__neutral"] {
  background-color: #2b5170 !important;
  color: #f5f4f0 !important;
  border: none !important;
}

.Button__neutral:hover,
[class*="Button__neutral"]:hover {
  background-color: #d6a33e !important;
  color: #2b5170 !important;
}

.Header__nav a,
.Sidebar__link,
[class*="Nav__"] a {
  color: #f5f4f0 !important;
}

.Header__nav a:hover,
.Sidebar__link:hover {
  color: #d6a33e !important;
}


/* ==================== TICKET PAGES ==================== */

.TicketDetail__container,
.NewTicket__container,
.TicketList__container {
  background-color: #f0ece0 !important;
}

.TicketDetail__title,
.NewTicket__title,
.TicketList__heading {
  color: #2b5170 !important;
}

.TicketDetail__statusOpen {
  background-color: #d6a33e !important;
  color: #2b5170 !important;
}


/* ==================== PULSING CHAT BUBBLE ==================== */

@keyframes pulse-ring {
  0%   { transform: scale(1); opacity: 0.8; }
  70%  { transform: scale(1.4); opacity: 0; }
  100% { transform: scale(1.4); opacity: 0; }
}

@keyframes pulse-dot {
  0%   { transform: scale(1); }
  50%  { transform: scale(1.08); }
  100% { transform: scale(1); }
}

.chat-bubble-pulse {
  animation: pulse-dot 2s ease-in-out infinite;
}

.chat-bubble-pulse::before {
  content: '';
  position: absolute;
  inset: -6px;
  border-radius: 50%;
  background: #d6a33e;
  animation: pulse-ring 2s ease-out infinite;
  z-index: -1;
}

/* Bigger chat bubble */
[id="zsiqwidget"],
[class*="zsiq_widget"],
.zsiq_float,
[class*="zsiq_float"] {
  transform: scale(1.3) !important;
  transform-origin: bottom right !important;
}


/* ==================== NAV BAR FULL WIDTH ==================== */

.Header__header,
.Header__headerContainer,
#headerRow,
.Header__headerSecondary,
.Header__headerSecondary.commonStyles__disFlex {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  box-sizing: border-box !important;
}

.Header__headerScroller {
  width: 100% !important;
  max-width: 100% !important;
}

.Breadcrumbs__breadCrumbs {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding-left: 16px !important;
}


/* ==================== FOOTER ==================== */

.FooterContainer__footer,
[class*="FooterContainer__footer"] {
  display: block !important;
  background-color: #2b5170 !important;
  border-top: 3px solid #d6a33e !important;
  text-align: center !important;
  padding: 14px 20px !important;
  color: #f5f4f0 !important;
  font-size: 12px !important;
}

.FooterContainer__footerSecondary,
.FooterContainer__footerTop,
.FooterContainer__footerBottom,
[class*="FooterContainer__footerSecondary"],
[class*="FooterContainer__footerTop"],
[class*="FooterContainer__footerBottom"],
[class*="FooterContainer__container"] {
  display: none !important;
}

.FooterContainer__footer::after {
  content: "© 2025 BackPocket Talent  |  myhradvocate.com  |  All Rights Reserved" !important;
  display: block !important;
  color: #f5f4f0 !important;
  font-size: 12px !important;
  text-align: center !important;
}