/* =========================================================
   HAMMONDS HELPDESK — STABLE MASTER CSS v7
   Safer Zoho build: simple selectors, no nested :has(), no JS.
   Covers homepage, submit ticket, ticket list, sign-in/recovery.
   Note: CSS cannot change link destinations. Set homepage Tickets/My Area tile URL in Zoho to /portal/en/newticket if it must open the ticket form.
   ========================================================= */

:root {
  --hf-bg: #f3f0ea;
  --hf-bg-2: #e7e2d9;
  --hf-surface: #f8f4ed;
  --hf-surface-2: #f2eee7;
  --hf-card: rgba(255,255,255,.96);
  --hf-ink: #24323b;
  --hf-ink-soft: rgba(36,50,59,.72);
  --hf-ink-faint: rgba(36,50,59,.50);
  --hf-line: rgba(214,206,193,.96);
  --hf-line-soft: rgba(214,206,193,.68);
  --hf-sage: #91a18b;
  --hf-sage-2: #7e8f77;
  --hf-sage-dark: #60705a;
  --hf-orange: #d8702b;
  --hf-orange-dark: #b95d23;
  --hf-shadow-xs: 0 6px 16px rgba(35,39,36,.04);
  --hf-shadow-sm: 0 10px 24px rgba(35,39,36,.05);
  --hf-shadow-md: 0 18px 42px rgba(35,39,36,.08);
  --hf-shadow-lg: 0 28px 68px rgba(35,39,36,.12);
  --hf-radius-xl: 34px;
  --hf-radius-lg: 24px;
  --hf-radius-md: 18px;
  --hf-pill: 999px;
  --hf-max: 1180px;
  --hf-hero: url("https://latorrecoalville.co.uk/wp-content/uploads/2026/03/ChatGPT-Image-Mar-20-2026-12_55_47-PM.png");
}
.AppContainer__backToTop,
span[data-id="toparrow"] {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}
*, *::before, *::after { box-sizing: border-box !important; }
html, body { margin: 0 !important; padding: 0 !important; min-height: 100% !important; }
html, body, body.body, #portal_html {
  background: radial-gradient(circle at top left, rgba(255,255,255,.45), transparent 28%), linear-gradient(180deg, var(--hf-bg), var(--hf-bg-2)) !important;
  color: var(--hf-ink) !important;
  font-family: Arial, Helvetica, sans-serif !important;
  -webkit-font-smoothing: antialiased !important;
  text-rendering: optimizeLegibility !important;
}
body, input, button, select, textarea { font-family: Arial, Helvetica, sans-serif !important; color: var(--hf-ink) !important; }
a { text-decoration: none !important; }
button, input, select, textarea { outline: none !important; }
body > h1 { display: none !important; }
#container { max-width: 1320px !important; margin: 0 auto !important; padding: 0 24px 56px !important; }
#mainContainer { position: relative !important; }
#footerContainer .Footer__footerCopyrigt, #footerContainer .Footer__container2 { display: none !important; }

/* =========================================================
   GLOBAL TOP MENU — keep simple and stable
   ========================================================= */

#navBar, .Header__navbar, #navBarContainer {
  display: block !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
#navBarContainer, .Header__container {
  max-width: var(--hf-max) !important;
  margin: 0 auto !important;
  padding: 18px 18px 12px !important;
}
#navBarContainer {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 24px !important;
}
.Header__logo, .Header__logo a, .Header__logoImg, .Header__logoImg img {
  display: inline-flex !important;
  align-items: center !important;
}
.Header__logoImg img { max-height: 400px !important; width: auto !important; }
.Header__name {
  color: var(--hf-ink) !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 1.35rem !important;
  font-weight: 700 !important;
  letter-spacing: -.01em !important;
}
.Header__menuTab { margin-left: auto !important; }
.Header__menuList {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 16px !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}
.Header__tabs__link {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 48px !important;
  min-width: 118px !important;
  padding: 0 24px !important;
  border: 1px solid var(--hf-line) !important;
  border-radius: var(--hf-pill) !important;
  background: rgba(255,255,255,.94) !important;
  color: var(--hf-ink) !important;
  font-size: 15px !important;
  font-weight: 800 !important;
  letter-spacing: .06em !important;
  box-shadow: var(--hf-shadow-xs) !important;
  white-space: nowrap !important;
}
.AppContainer__backToTop,
span[data-id="toparrow"] {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}
.Header__tabsTab.Header__active .Header__tabs__link, #portal_tabHome.Header__active .Header__tabs__link {
  background: linear-gradient(180deg, var(--hf-sage), var(--hf-sage-2)) !important;
  color: #fff !important;
  border-color: transparent !important;
  box-shadow: 0 14px 28px rgba(125,143,119,.18) !important;
}
.Header__tabs__link:hover { transform: translateY(-1px) !important; box-shadow: var(--hf-shadow-sm) !important; }

/* Remove Knowledge Base top tab everywhere. The homepage tile remains available. */
#portal_tabSolutions,
li#portal_tabSolutions,
.Header__tabsTab[id*="Solutions"],
.Header__tabsTab[data-id*="Solutions"],
.Header__tabsTab:has(a[href*="/kb"]),
.Header__tabsTab:has(a[href*="/solutions"]) {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* Keep My Area label clean if Zoho joins text together. */
#portal_tabCases .Header__tabs__link {
  font-size: 0 !important;
  line-height: 0 !important;
}
#portal_tabCases .Header__tabs__link::after {
  content: "My Area" !important;
  font-size: 15px !important;
  line-height: 1 !important;
  font-weight: 800 !important;
  letter-spacing: .06em !important;
}

/* Sign in should not show in the public menu. */
#portal_tabSignin, #portal_tabSignIn, #portal_tabLogin, #logoutDetails, #userPreference {
  display: none !important;
  visibility: hidden !important;
}

/* Header shell */
#headerContainer {
  background: rgba(246,242,235,.97) !important;
  border-bottom: 1px solid var(--hf-line-soft) !important;
  box-shadow: 0 10px 28px rgba(35,39,36,.06) !important;
}

/* =========================================================
   SHARED SEARCH
   ========================================================= */

.SearchContainer__globalSearch { display: flex !important; align-items: stretch !important; width: 100% !important; }
.SearchContainer__formGroup { flex: 1 1 auto !important; }
.Input__headerSearch, .Input__searchBox {
  min-height: 56px !important;
  width: 100% !important;
  padding: 0 18px !important;
  border: 1px solid var(--hf-line) !important;
  border-radius: 18px 0 0 18px !important;
  background: rgba(255,255,255,.98) !important;
  box-shadow: none !important;
  color: var(--hf-ink) !important;
  font-size: 1rem !important;
}
.SearchContainer__searchIcon, .SearchContainer__searchBoxIcon, .commonStyle__zt3BrandBg {
  min-width: 58px !important;
  min-height: 56px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 1px solid rgba(92,110,86,.9) !important;
  border-left: 0 !important;
  border-radius: 0 18px 18px 0 !important;
  background: linear-gradient(180deg, var(--hf-sage), var(--hf-sage-2)) !important;
  color: #fff !important;
}
#searchContainer2 { display: none !important; }

/* =========================================================
   HOMEPAGE
   ========================================================= */

body:has(#layoutContainer[data-id="home"]) #container { padding-top: 0 !important; }
body:has(#layoutContainer[data-id="home"]) #headerContainer {
  position: relative !important;
  top: auto !important;
  z-index: 5 !important;
  background: rgba(246,242,235,.97) !important;
  border-bottom: 1px solid var(--hf-line-soft) !important;
  box-shadow: 0 10px 28px rgba(35,39,36,.06) !important;
}
body:has(#layoutContainer[data-id="home"]) #mainContainer { max-width: 1080px !important; margin: 0 auto !important; }
body:has(#layoutContainer[data-id="home"]) #headerContent, body:has(#layoutContainer[data-id="home"]) .Header__searchSection {
  min-height: 392px !important;
  margin: 0 auto !important;
  padding: 54px 56px !important;
  border-radius: var(--hf-radius-xl) !important;
  overflow: hidden !important;
  background-image: linear-gradient(rgba(55,73,50,.10), rgba(55,73,50,.10)), var(--hf-hero) !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  background-color: #90a08a !important;
  box-shadow: var(--hf-shadow-lg) !important;
  position: relative !important;
  z-index: 2 !important;
}
body:has(#layoutContainer[data-id="home"]) #headerContentContainer {
  max-width: 1080px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  display: block !important;
  position: relative !important;
  z-index: 2 !important;
}
body:has(#layoutContainer[data-id="home"]) .Header__searchTitle {
  display: block !important;
  max-width: 540px !important;
  margin: 0 0 14px !important;
  color: #fff !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: clamp(3rem,4vw,4.9rem) !important;
  font-weight: 500 !important;
  line-height: .96 !important;
  letter-spacing: -.03em !important;
  text-shadow: 0 2px 10px rgba(0,0,0,.12) !important;
}
body:has(#layoutContainer[data-id="home"]) .Header__description {
  display: block !important;
  max-width: 500px !important;
  margin: 0 0 28px !important;
  color: rgba(255,255,255,.96) !important;
  font-size: 1.04rem !important;
  line-height: 1.58 !important;
  text-shadow: 0 1px 4px rgba(0,0,0,.08) !important;
}
body:has(#layoutContainer[data-id="home"]) #searchContainer1, body:has(#layoutContainer[data-id="home"]) .Header__globalSearch {
  max-width: 560px !important;
  margin: 0 !important;
}
body:has(#layoutContainer[data-id="home"]) .SearchContainer__globalSearch {
  overflow: hidden !important;
  border-radius: 16px !important;
  box-shadow: 0 10px 22px rgba(0,0,0,.08) !important;
}
body:has(#layoutContainer[data-id="home"]) .Input__headerSearch { min-height: 58px !important; border-radius: 16px 0 0 16px !important; }
body:has(#layoutContainer[data-id="home"]) .SearchContainer__searchIcon { min-height: 58px !important; border-radius: 0 16px 16px 0 !important; }

/* White shell and CTA band: no scroll jump, no header gap */
body:has(#layoutContainer[data-id="home"]) #layoutContainer[data-id="home"] {
  max-width: 1040px !important;
  margin: 0 auto !important;
  padding: 210px 28px 52px !important;
  border: 1px solid var(--hf-line-soft) !important;
  border-top: 0 !important;
  border-radius: 0 0 var(--hf-radius-xl) var(--hf-radius-xl) !important;
  background: rgba(255,255,255,.90) !important;
  box-shadow: var(--hf-shadow-md) !important;
  position: relative !important;
  z-index: 1 !important;
}
body:has(#layoutContainer[data-id="home"]) #footerContainer {
  display: block !important;
  position: absolute !important;
  top: 452px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: min(1040px, calc(100% - 48px)) !important;
  margin: 0 !important;
  padding: 0 !important;
  z-index: 20 !important;
  background: transparent !important;
}
body:has(#layoutContainer[data-id="home"]) #footerContainer .Footer__footerBg,
body:has(#layoutContainer[data-id="home"]) #footerContainer .Footer__container,
body:has(#layoutContainer[data-id="home"]) #footerContainer .Footer__container1 { margin: 0 !important; padding: 0 !important; background: transparent !important; box-shadow: none !important; }
body:has(#layoutContainer[data-id="home"]) #footerContainer .Footer__footerContent {
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid var(--hf-line) !important;
  border-top: 0 !important;
  border-radius: 0 0 var(--hf-radius-lg) var(--hf-radius-lg) !important;
  background: var(--hf-surface) !important;
  box-shadow: 0 16px 34px rgba(35,39,36,.08) !important;
  overflow: hidden !important;
}
body:has(#layoutContainer[data-id="home"]) #footerContainer .Footer__footerInfo {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 24px !important;
  padding: 30px 32px !important;
  background: linear-gradient(180deg, rgba(248,244,237,.98), rgba(243,239,232,.98)) !important;
}
body:has(#layoutContainer[data-id="home"]) #footerContainer .Footer__footerQus { font-size: 0 !important; line-height: 0 !important; }
body:has(#layoutContainer[data-id="home"]) #footerContainer .Footer__footerQus::after {
  content: "Need an agent to help you with your issue?" !important;
  display: block !important;
  color: var(--hf-ink) !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 1.08rem !important;
  font-weight: 500 !important;
  line-height: 1.22 !important;
}
body:has(#layoutContainer[data-id="home"]) #footerContainer .Footer__footerDescription,
body:has(#layoutContainer[data-id="home"]) #footerContainer .Footer__footerDescription span { color: var(--hf-ink-soft) !important; font-size: .98rem !important; line-height: 1.55 !important; }
.Button__footerBtn, .Footer__footerBtn button {
  min-width: 184px !important;
  min-height: 50px !important;
  padding: 0 24px !important;
  border: 1px solid transparent !important;
  border-radius: var(--hf-pill) !important;
  background: linear-gradient(180deg, var(--hf-sage), var(--hf-sage-2)) !important;
  color: #fff !important;
  font-weight: 800 !important;
  box-shadow: 0 14px 26px rgba(125,143,119,.18) !important;
}

/* Homepage tiles */
body:has(#layoutContainer[data-id="home"]) .ModuleCont__moduleCont { margin-top: 34px !important; }
body:has(#layoutContainer[data-id="home"]) .ModuleCont__moduleCont > div:last-child {
  display: flex !important;
  justify-content: center !important;
  align-items: stretch !important;
  gap: 32px !important;
  flex-wrap: wrap !important;
}
body:has(#layoutContainer[data-id="home"]) #kb_module, body:has(#layoutContainer[data-id="home"]) #ticket_module {
  width: 330px !important;
  max-width: 330px !important;
  margin: 0 !important;
  float: none !important;
}
body:has(#layoutContainer[data-id="home"]) #kb_module .ContentBox__boxInnerHome,
body:has(#layoutContainer[data-id="home"]) #ticket_module .ContentBox__boxInnerHome {
  min-height: 238px !important;
  padding: 30px 24px 26px !important;
  border-radius: 26px !important;
  border: 1px solid var(--hf-line) !important;
  background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,245,239,.98)) !important;
  box-shadow: var(--hf-shadow-sm) !important;
  text-align: center !important;
}
body:has(#layoutContainer[data-id="home"]) #kb_module .ContentBox__headerMid a,
body:has(#layoutContainer[data-id="home"]) #ticket_module .ContentBox__headerMid a {
  color: var(--hf-ink) !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 1.9rem !important;
  font-weight: 500 !important;
}
body:has(#layoutContainer[data-id="home"]) #ticket_module .ContentBox__headerMid a { font-size: 0 !important; }
body:has(#layoutContainer[data-id="home"]) #ticket_module .ContentBox__headerMid a::after { content: "Tickets" !important; font-size: 1.9rem !important; }
body:has(#layoutContainer[data-id="home"]) #ticket_module p { font-size: 0 !important; }
body:has(#layoutContainer[data-id="home"]) #ticket_module p::after { content: "Click here to login and view your submitted tickets" !important; font-size: 1rem !important; line-height: 1.55 !important; color: var(--hf-ink-soft) !important; }
body:has(#layoutContainer[data-id="home"]) .popularAricles,
body:has(#layoutContainer[data-id="home"]) .popularArticles,
body:has(#layoutContainer[data-id="home"]) .PopularArticles,
body:has(#layoutContainer[data-id="home"]) .WidgetContainer__boxSplit.popularAricles,
body:has(#layoutContainer[data-id="home"]) [class*="popular"],
body:has(#layoutContainer[data-id="home"]) [class*="Popular"] { display: none !important; visibility: hidden !important; height: 0 !important; overflow: hidden !important; margin: 0 !important; padding: 0 !important; }
body:has(#layoutContainer[data-id="home"]) .AppContainer__breadCrumbs, body:has(#layoutContainer[data-id="home"]) #breadCrumbsContainer { display: none !important; }

/* =========================================================
   SUBMIT A TICKET PAGE — only Home button, no right rail/articles
   ========================================================= */

body:has(#layoutContainer[data-id="ticketForm"]) #portal_tabCases,
body:has(#layoutContainer[data-id="ticketForm"]) #portal_tabSolutions,
body:has(#layoutContainer[data-id="ticketForm"]) #portal_tabSignin,
body:has(#layoutContainer[data-id="ticketForm"]) #portal_tabSignIn,
body:has(#layoutContainer[data-id="ticketForm"]) #logoutDetails,
body:has(#layoutContainer[data-id="ticketForm"]) #userPreference,
body:has(#layoutContainer[data-id="ticketForm"]) .Header__name,
body:has(#layoutContainer[data-id="ticketForm"]) .Header__menuicon { display: none !important; }
body:has(#layoutContainer[data-id="ticketForm"]) #navBarContainer { justify-content: flex-end !important; }
body:has(#layoutContainer[data-id="ticketForm"]) #portal_tabHome { display: block !important; }
body:has(#layoutContainer[data-id="ticketForm"]) #headerContentContainer {
  max-width: 1120px !important;
  margin: 0 auto !important;
  padding: 12px 18px 14px !important;
  display: grid !important;
  grid-template-columns: minmax(0,1fr) 430px !important;
  gap: 24px !important;
  align-items: center !important;
}
body:has(#layoutContainer[data-id="ticketForm"]) .Header__searchTitle, body:has(#layoutContainer[data-id="ticketForm"]) .Header__description { display: none !important; }
body:has(#layoutContainer[data-id="ticketForm"]) .BreadCrumbs__breadcrumbsView { color: var(--hf-ink-soft) !important; }
body:has(#layoutContainer[data-id="ticketForm"]) .BreadCrumbs__breadcrumbsView span:first-child { font-size: 0 !important; }
body:has(#layoutContainer[data-id="ticketForm"]) .BreadCrumbs__breadcrumbsView span:first-child::after { content: "Home" !important; font-size: 15px !important; }
body:has(#layoutContainer[data-id="ticketForm"]) #layoutContainer[data-id="ticketForm"] {
  max-width: 1120px !important;
  margin: 24px auto 0 !important;
  padding: 46px 56px 52px !important;
  border: 1px solid var(--hf-line-soft) !important;
  border-radius: var(--hf-radius-xl) !important;
  background: linear-gradient(180deg, rgba(248,244,237,.99), rgba(243,239,232,.99)) !important;
  box-shadow: var(--hf-shadow-lg) !important;
}
body:has(#layoutContainer[data-id="ticketForm"]) #layoutContainer[data-id="ticketForm"] .Layout__layout1 { float: none !important; width: 100% !important; max-width: 760px !important; margin: 0 auto !important; }
body:has(#layoutContainer[data-id="ticketForm"]) #layoutContainer[data-id="ticketForm"] .Layout__layout2,
body:has(#layoutContainer[data-id="ticketForm"]) .TicketFormRightContainer__rightPanelDetail,
body:has(#layoutContainer[data-id="ticketForm"]) .TicketFormRightContainer__widgetRight,
body:has(#layoutContainer[data-id="ticketForm"]) .ScrollSticky__type2,
body:has(#layoutContainer[data-id="ticketForm"]) .popularAricles,
body:has(#layoutContainer[data-id="ticketForm"]) .PopularArticles,
body:has(#layoutContainer[data-id="ticketForm"]) [class*="Popular"],
body:has(#layoutContainer[data-id="ticketForm"]) [class*="Related"] { display: none !important; }
body:has(#layoutContainer[data-id="ticketForm"]) #ticketform_fields_container { background: transparent !important; border: 0 !important; box-shadow: none !important; padding: 0 !important; }
body:has(#layoutContainer[data-id="ticketForm"]) .TicketFormLeftContainer__formHeader { text-align: center !important; margin: 0 0 34px !important; }
body:has(#layoutContainer[data-id="ticketForm"]) .TicketFormLeftContainer__formTitle {
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: clamp(2.55rem,4vw,3.45rem) !important;
  font-weight: 500 !important;
  line-height: 1.04 !important;
  letter-spacing: -.02em !important;
  text-align: center !important;
}
body:has(#layoutContainer[data-id="ticketForm"]) .TicketFormLeftContainer__formHeader::after { content: "" !important; display: block !important; width: 88px !important; height: 2px !important; margin: 18px auto 0 !important; background: linear-gradient(90deg, rgba(145,161,139,.08), rgba(145,161,139,.92), rgba(145,161,139,.08)) !important; }
body:has(#layoutContainer[data-id="ticketForm"]) .TicketFormLeftContainer__sectionName { margin: 30px 0 18px !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 1.25rem !important; color: #52616e !important; }
body:has(#layoutContainer[data-id="ticketForm"]) .Form__formElement { margin: 0 0 22px !important; }
body:has(#layoutContainer[data-id="ticketForm"]) .FormElement__formLabelvertical { margin: 0 0 8px !important; font-weight: 700 !important; color: #1f2b33 !important; }
body:has(#layoutContainer[data-id="ticketForm"]) .Input__formInput,
body:has(#layoutContainer[data-id="ticketForm"]) .Input__productInput,
body:has(#layoutContainer[data-id="ticketForm"]) .DropDown__dropdown {
  min-height: 60px !important;
  padding: 0 18px !important;
  border: 1px solid var(--hf-line) !important;
  border-radius: 22px !important;
  background: rgba(255,255,255,.96) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.78), 0 8px 18px rgba(35,39,36,.03) !important;
}
body:has(#layoutContainer[data-id="ticketForm"]) #field_description .KB_Editor { border: 1px solid var(--hf-line) !important; border-radius: 24px !important; overflow: hidden !important; background: #fff !important; }
body:has(#layoutContainer[data-id="ticketForm"]) #field_description .KB_Editor_iframe { min-height: 240px !important; }
body:has(#layoutContainer[data-id="ticketForm"]) .TicketFormLeftContainer__formFooter { display: flex !important; justify-content: center !important; gap: 14px !important; margin-top: 32px !important; }
body:has(#layoutContainer[data-id="ticketForm"]) .TicketFormLeftContainer__formFooter .Button__primary { min-height: 56px !important; min-width: 138px !important; padding: 0 28px !important; border-radius: var(--hf-pill) !important; background: linear-gradient(180deg, var(--hf-sage), var(--hf-sage-2)) !important; color: #fff !important; font-weight: 800 !important; }
body:has(#layoutContainer[data-id="ticketForm"]) .TicketFormLeftContainer__formFooter .Button__secondary { min-height: 56px !important; min-width: 132px !important; padding: 0 26px !important; border: 1px solid var(--hf-line) !important; border-radius: var(--hf-pill) !important; background: #fff !important; color: #59615b !important; font-weight: 800 !important; }

/* =========================================================
   MY AREA / TICKET LIST — professional UI, no box-within-box outlines
   ========================================================= */

body:has(#layoutContainer[data-id="ticketList"]) .AppContainer__breadCrumbs,
body:has(#layoutContainer[data-id="ticketList"]) #breadCrumbsContainer,
body:has(#layoutContainer[data-id="ticketList"]) .SearchContainer__searchBox { display: none !important; }
body:has(#layoutContainer[data-id="ticketList"]) #headerContent, body:has(#layoutContainer[data-id="ticketList"]) .Header__searchSection { display: none !important; }
body:has(#layoutContainer[data-id="ticketList"]) #mainContainer { max-width: 1160px !important; margin: 0 auto !important; padding: 30px 0 54px !important; }
body:has(#layoutContainer[data-id="ticketList"]) #layoutContainer[data-id="ticketList"] {
  max-width: 1120px !important;
  margin: 0 auto !important;
  padding: 34px !important;
  border: 1px solid var(--hf-line-soft) !important;
  border-radius: var(--hf-radius-xl) !important;
  background: linear-gradient(180deg, rgba(255,255,255,.96), rgba(248,245,239,.96)) !important;
  box-shadow: var(--hf-shadow-lg) !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 300px !important;
  gap: 28px !important;
}
body:has(#layoutContainer[data-id="ticketList"]) .Layout__layout1,
body:has(#layoutContainer[data-id="ticketList"]) .Layout__layout2 { float: none !important; width: auto !important; }
body:has(#layoutContainer[data-id="ticketList"]) .TicketList__cv_filterViews { display: none !important; }
body:has(#layoutContainer[data-id="ticketList"]) .TicketList__header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
  padding: 0 0 18px !important;
  border-bottom: 1px solid var(--hf-line-soft) !important;
  margin-bottom: 18px !important;
}
body:has(#layoutContainer[data-id="ticketList"]) .TicketList__filterPanel { display: flex !important; gap: 10px !important; flex-wrap: wrap !important; }
body:has(#layoutContainer[data-id="ticketList"]) .TicketFilterPopup__wrapper,
body:has(#layoutContainer[data-id="ticketList"]) .DropDown__dropdown {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 42px !important;
  padding: 0 14px !important;
  border: 1px solid var(--hf-line) !important;
  border-radius: 14px !important;
  background: rgba(255,255,255,.88) !important;
  box-shadow: none !important;
  color: var(--hf-ink) !important;
}
body:has(#layoutContainer[data-id="ticketList"]) .TicketFilterPopup__filterValue { color: var(--hf-ink) !important; font-weight: 700 !important; }
body:has(#layoutContainer[data-id="ticketList"]) .TicketFilterPopup__active { color: var(--hf-orange) !important; }
body:has(#layoutContainer[data-id="ticketList"]) .TicketList__actions { display: flex !important; gap: 10px !important; align-items: center !important; }
body:has(#layoutContainer[data-id="ticketList"]) .TicketList__ticketListContent { margin: 0 !important; padding: 0 !important; list-style: none !important; }
body:has(#layoutContainer[data-id="ticketList"]) .TicketListItem__listItem {
  margin: 0 0 14px !important;
  padding: 18px 18px !important;
  border: 1px solid var(--hf-line-soft) !important;
  border-radius: 22px !important;
  background: rgba(255,255,255,.88) !important;
  box-shadow: var(--hf-shadow-xs) !important;
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease !important;
}
body:has(#layoutContainer[data-id="ticketList"]) .TicketListItem__listItem:hover { transform: translateY(-1px) !important; box-shadow: var(--hf-shadow-sm) !important; background: #fff !important; }
body:has(#layoutContainer[data-id="ticketList"]) .MediaObject__mediaObject { display: block !important; }
body:has(#layoutContainer[data-id="ticketList"]) .TicketListItem__tickettile_container { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 16px !important; }
body:has(#layoutContainer[data-id="ticketList"]) .TicketListItem__ticketCardTitle {
  color: var(--hf-ink) !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 1.45rem !important;
  font-weight: 600 !important;
  line-height: 1.15 !important;
}
body:has(#layoutContainer[data-id="ticketList"]) .TicketListItem__ticketStatus_and_details { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 18px !important; margin-top: 10px !important; }
body:has(#layoutContainer[data-id="ticketList"]) .TicketListItem__ticketlistItem .List__listItem { color: var(--hf-ink-soft) !important; font-size: .92rem !important; margin-right: 10px !important; }
body:has(#layoutContainer[data-id="ticketList"]) .TicketListItem__ticketStatus {
  padding: 7px 12px !important;
  border-radius: var(--hf-pill) !important;
  background: rgba(145,161,139,.12) !important;
  color: var(--hf-sage-dark) !important;
  font-weight: 800 !important;
  font-size: .82rem !important;
}
body:has(#layoutContainer[data-id="ticketList"]) .TicketList__rightPanelDetail,
body:has(#layoutContainer[data-id="ticketList"]) .TicketList__widgetRight { margin: 0 !important; padding: 0 !important; background: transparent !important; border: 0 !important; box-shadow: none !important; }
body:has(#layoutContainer[data-id="ticketList"]) .TicketList__widgetSection {
  margin: 0 0 18px !important;
  padding: 22px !important;
  border: 1px solid var(--hf-line-soft) !important;
  border-radius: 24px !important;
  background: rgba(255,255,255,.88) !important;
  box-shadow: var(--hf-shadow-xs) !important;
}
body:has(#layoutContainer[data-id="ticketList"]) .TicketList__widgetSection:first-child { padding: 0 !important; border: 0 !important; background: transparent !important; box-shadow: none !important; }
body:has(#layoutContainer[data-id="ticketList"]) .TicketList__widgetSection .Button__primary {
  width: 100% !important;
  min-height: 50px !important;
  border: 0 !important;
  border-radius: var(--hf-pill) !important;
  background: linear-gradient(180deg, var(--hf-orange), var(--hf-orange-dark)) !important;
  color: #fff !important;
  font-weight: 800 !important;
  box-shadow: 0 14px 26px rgba(216,112,43,.18) !important;
}
body:has(#layoutContainer[data-id="ticketList"]) .ListHeader__header1 { margin: 0 0 12px !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 1.45rem !important; color: var(--hf-ink) !important; }
body:has(#layoutContainer[data-id="ticketList"]) .TicketList__accountCont { margin: 0 !important; padding: 0 !important; list-style: none !important; }
body:has(#layoutContainer[data-id="ticketList"]) .TicketList__accountList a {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 12px 12px !important;
  border-radius: 14px !important;
  color: var(--hf-ink) !important;
  font-weight: 700 !important;
}
body:has(#layoutContainer[data-id="ticketList"]) .TicketList__accountList a:hover,
body:has(#layoutContainer[data-id="ticketList"]) .TicketList__accountSelect { background: rgba(145,161,139,.12) !important; color: var(--hf-orange) !important; }

/* =========================================================
   PORTAL SIGN-IN WRAPPER AND STANDALONE AUTH
   ========================================================= */

body:has(#iamFrame) #headerContentContainer { max-width: 1120px !important; margin: 0 auto !important; padding: 12px 18px 14px !important; display: grid !important; grid-template-columns: minmax(0,1fr) 430px !important; gap: 24px !important; align-items: center !important; }
body:has(#iamFrame) .Header__searchTitle, body:has(#iamFrame) .Header__description { display: none !important; }
body:has(#iamFrame) #mainContainer { max-width: 1180px !important; margin: 0 auto !important; padding: 28px 0 56px !important; }
body:has(#iamFrame) #layoutContainer { max-width: 980px !important; margin: 0 auto !important; padding: 28px !important; border: 1px solid var(--hf-line-soft) !important; border-radius: var(--hf-radius-xl) !important; background: linear-gradient(180deg, rgba(248,244,237,.99), rgba(243,239,232,.99)) !important; box-shadow: var(--hf-shadow-lg) !important; }
body:has(#iamFrame) .UserContainer__innerContainer1 { max-width: 840px !important; margin: 0 auto !important; padding: 26px 28px !important; border: 1px solid var(--hf-line) !important; border-radius: 26px !important; background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,245,239,.98)) !important; box-shadow: var(--hf-shadow-sm) !important; }
body:has(#iamFrame) .Signin__loginTitle { font-family: Georgia, "Times New Roman", serif !important; font-size: clamp(2rem,3vw,2.7rem) !important; color: var(--hf-ink) !important; font-weight: 500 !important; }
body:has(#iamFrame) .Signin__iframe, body:has(#iamFrame) #iamFrame { display: block !important; width: 100% !important; height: 430px !important; min-height: 430px !important; max-height: 560px !important; border: 0 !important; border-radius: 18px !important; background: transparent !important; overflow: hidden !important; }

.bg_one { position: fixed !important; inset: 0 !important; z-index: 0 !important; background: radial-gradient(circle at top left, rgba(255,255,255,.45), transparent 28%), linear-gradient(180deg, var(--hf-bg), var(--hf-bg-2)) !important; }
.signin_container, .recovery_container { position: relative !important; z-index: 2 !important; margin: 34px auto !important; width: min(calc(100% - 48px), 760px) !important; max-width: 760px !important; }
.signin_box, .recovery_box { height: auto !important; min-height: 0 !important; max-height: none !important; padding: 28px !important; border: 1px solid var(--hf-line) !important; border-radius: var(--hf-radius-xl) !important; background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,245,239,.98)) !important; box-shadow: var(--hf-shadow-lg) !important; overflow: visible !important; }
.titlename { display: block !important; margin: 0 0 18px !important; text-align: center !important; font-family: Georgia, "Times New Roman", serif !important; font-size: clamp(2rem,4vw,3rem) !important; font-weight: 500 !important; color: var(--hf-ink) !important; text-transform: none !important; }
.signin_head #headtitle, .info_head #headtitle, .rec_head_text { display: block !important; font-family: Georgia, "Times New Roman", serif !important; font-size: clamp(1.85rem,3vw,2.55rem) !important; color: var(--hf-ink) !important; font-weight: 500 !important; line-height: 1.05 !important; }
.service_name, .head_info, .backup_desc, .verifyCaptcha_desc, .option_description, .try_option_desc, .session_terminate_desc { color: var(--hf-ink-soft) !important; font-size: .98rem !important; line-height: 1.55 !important; }
#signin_flow, #recovery_flow, #signin_div, #lookup_div, .recover_sections, .fieldcontainer, .searchparent, .textbox_div, form { height: auto !important; min-height: 0 !important; max-height: none !important; }
.fieldcontainer { margin-top: 16px !important; padding: 0 !important; background: transparent !important; border: 0 !important; box-shadow: none !important; }
.searchparent { margin: 0 0 14px !important; padding: 0 !important; background: transparent !important; border: 0 !important; box-shadow: none !important; }
.textbox_div { margin: 0 !important; padding: 0 !important; background: transparent !important; border: 0 !important; box-shadow: none !important; }
.textbox, input.textbox, input[type="text"], input[type="password"], input[type="email"], input[type="number"], select { width: 100% !important; height: 56px !important; min-height: 56px !important; padding: 0 18px !important; border: 1px solid var(--hf-line) !important; border-radius: var(--hf-radius-md) !important; background: rgba(255,255,255,.98) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.85), 0 10px 20px rgba(35,39,36,.03) !important; font-size: 16px !important; color: var(--hf-ink) !important; }
.textbox:focus, input:focus, select:focus, textarea:focus { border-color: var(--hf-sage) !important; box-shadow: 0 0 0 4px rgba(145,161,139,.14), 0 14px 26px rgba(35,39,36,.05) !important; }
.btn, button.btn, .Captcha_btnblue, .ppsuccess_button { min-height: 50px !important; padding: 0 24px !important; border: 0 !important; border-radius: var(--hf-pill) !important; background: linear-gradient(180deg, var(--hf-sage), var(--hf-sage-2)) !important; color: #fff !important; font-weight: 800 !important; box-shadow: 0 16px 30px rgba(125,143,119,.18) !important; }
.recover_sections, .password_expiry_container, .terminate_session_container, .trustbrowser_ui, #success_pcontainer, .error_portion, .nopassword_container, #backup_container, #emailcheck_container, #emailverify_container, #verifycaptcha_container, #recovery_container { margin-top: 14px !important; padding: 18px !important; border: 1px solid var(--hf-line) !important; border-radius: 22px !important; background: rgba(255,255,255,.90) !important; box-shadow: var(--hf-shadow-xs) !important; height: auto !important; min-height: 0 !important; }
#lookup_div.recover_sections, #signin_div { padding: 0 !important; border: 0 !important; background: transparent !important; box-shadow: none !important; }
.getpassword.zeroheight { max-height: 0 !important; opacity: 0 !important; overflow: hidden !important; pointer-events: none !important; margin: 0 !important; padding: 0 !important; }
.getpassword:not(.zeroheight) { max-height: 260px !important; opacity: 1 !important; overflow: visible !important; margin-top: 12px !important; pointer-events: auto !important; }
.bluetext_action, .bluetext, .blue_link, .bottom_option, .change_user, .Notyou, .resendotp, .goToForgotPassword, .goToForgotPassword a, #recoverybtn, #problemsignin, #forgotpassword, #otp_resend, .blueforgotpassword, .backoption { color: var(--hf-orange) !important; font-weight: 800 !important; cursor: pointer !important; }

/* =========================================================
   SHARED FOOTER CTA ON NON-HOME PAGES
   ========================================================= */

body:has(#layoutContainer[data-id="ticketList"]) #footerContainer,
body:has(#layoutContainer[data-id="ticketForm"]) #footerContainer,
body:has(#iamFrame) #footerContainer { max-width: 1120px !important; margin: 22px auto 0 !important; padding: 0 !important; background: transparent !important; }
body:has(#layoutContainer[data-id="ticketList"]) #footerContainer .Footer__footerContent,
body:has(#layoutContainer[data-id="ticketForm"]) #footerContainer .Footer__footerContent,
body:has(#iamFrame) #footerContainer .Footer__footerContent { border: 1px solid var(--hf-line) !important; border-radius: 26px !important; background: linear-gradient(180deg, rgba(248,244,237,.98), rgba(243,239,232,.98)) !important; box-shadow: var(--hf-shadow-md) !important; }
body:has(#layoutContainer[data-id="ticketList"]) #footerContainer .Footer__footerInfo,
body:has(#layoutContainer[data-id="ticketForm"]) #footerContainer .Footer__footerInfo,
body:has(#iamFrame) #footerContainer .Footer__footerInfo { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 24px !important; padding: 28px 32px !important; text-align: left !important; }
body:has(#layoutContainer[data-id="ticketList"]) #footerContainer .Footer__footerQus,
body:has(#layoutContainer[data-id="ticketForm"]) #footerContainer .Footer__footerQus,
body:has(#iamFrame) #footerContainer .Footer__footerQus { font-size: 0 !important; line-height: 0 !important; }
body:has(#layoutContainer[data-id="ticketList"]) #footerContainer .Footer__footerQus::after,
body:has(#layoutContainer[data-id="ticketForm"]) #footerContainer .Footer__footerQus::after,
body:has(#iamFrame) #footerContainer .Footer__footerQus::after { content: "Still can’t find an answer?" !important; display: block !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 1.9rem !important; line-height: 1.1 !important; color: var(--hf-ink) !important; }

/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 1100px) {
  #container { padding: 0 16px 44px !important; }
  #navBarContainer { gap: 14px !important; }
  .Header__menuList { gap: 10px !important; }
  .Header__tabs__link { min-width: 104px !important; padding: 0 16px !important; }
  body:has(#layoutContainer[data-id="home"]) #footerContainer { width: calc(100% - 32px) !important; }
  body:has(#layoutContainer[data-id="ticketList"]) #layoutContainer[data-id="ticketList"] { grid-template-columns: 1fr !important; }
}

@media (max-width: 768px) {
  #container { padding: 0 12px 34px !important; }
  #navBarContainer { flex-wrap: wrap !important; justify-content: center !important; padding: 14px 12px !important; }
  .Header__menuTab { margin-left: 0 !important; width: 100% !important; }
  .Header__menuList { justify-content: center !important; flex-wrap: wrap !important; }
  .Header__tabs__link { min-height: 44px !important; min-width: 96px !important; padding: 0 14px !important; font-size: 14px !important; }
  #portal_tabCases .Header__tabs__link::after { font-size: 14px !important; }
  body:has(#layoutContainer[data-id="home"]) #headerContent, body:has(#layoutContainer[data-id="home"]) .Header__searchSection { min-height: auto !important; padding: 34px 24px 30px !important; border-radius: 24px !important; }
  body:has(#layoutContainer[data-id="home"]) .Header__searchTitle { font-size: 2.4rem !important; }
  body:has(#layoutContainer[data-id="home"]) #footerContainer { position: relative !important; top: auto !important; left: auto !important; transform: none !important; width: 100% !important; margin: -1px auto 0 !important; }
  body:has(#layoutContainer[data-id="home"]) #layoutContainer[data-id="home"] { padding: 26px 16px 30px !important; border-top: 1px solid var(--hf-line-soft) !important; border-radius: 0 0 22px 22px !important; }
  body:has(#layoutContainer[data-id="home"]) #footerContainer .Footer__footerInfo { flex-direction: column !important; align-items: flex-start !important; }
  body:has(#layoutContainer[data-id="home"]) #kb_module, body:has(#layoutContainer[data-id="home"]) #ticket_module { width: 100% !important; max-width: none !important; }
  body:has(#layoutContainer[data-id="ticketForm"]) #headerContentContainer, body:has(#iamFrame) #headerContentContainer { grid-template-columns: 1fr !important; }
  body:has(#layoutContainer[data-id="ticketForm"]) #layoutContainer[data-id="ticketForm"], body:has(#layoutContainer[data-id="ticketList"]) #layoutContainer[data-id="ticketList"], body:has(#iamFrame) #layoutContainer { padding: 22px 14px 24px !important; border-radius: 22px !important; }
  body:has(#layoutContainer[data-id="ticketForm"]) .TicketFormLeftContainer__formFooter { flex-direction: column !important; }
  body:has(#layoutContainer[data-id="ticketForm"]) .TicketFormLeftContainer__formFooter .Button__primary, body:has(#layoutContainer[data-id="ticketForm"]) .TicketFormLeftContainer__formFooter .Button__secondary, .Button__footerBtn { width: 100% !important; }
  body:has(#iamFrame) .Signin__iframe, body:has(#iamFrame) #iamFrame { height: 520px !important; min-height: 520px !important; }
  .signin_container, .recovery_container { width: min(calc(100% - 20px), 100%) !important; margin-top: 20px !important; }
  .signin_box, .recovery_box { padding: 22px 16px 20px !important; border-radius: 24px !important; }
}

/* =========================================================
   v9 SAFE HOTFIX — Zoho-compatible, no experimental properties
   - Removes Knowledge Base top menu everywhere
   - Keeps home header/menu non-sticky so it does not follow down page
   - Keeps homepage CTA band locked under hero without scroll drift
   - Keeps popular articles hidden on homepage
   ========================================================= */

/* Top menu: keep Home and My Area only. Knowledge Base remains available via homepage card/search. */
#portal_tabSolutions,
.Header__menuList #portal_tabSolutions,
li#portal_tabSolutions {
  display: none !important;
  visibility: hidden !important;
}

/* Homepage header must scroll naturally, not stick over the hero or pull the CTA down. */
body:has(#layoutContainer[data-id="home"]) #headerContainer,
body:has(#layoutContainer[data-id="home"]) .Header__header,
body:has(#layoutContainer[data-id="home"]) #navBar,
body:has(#layoutContainer[data-id="home"]) #navBarContainer,
body:has(#layoutContainer[data-id="home"]) #headerContent,
body:has(#layoutContainer[data-id="home"]) #headerContentContainer,
body:has(#layoutContainer[data-id="home"]) .Header__searchSection {
  position: relative !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
  transform: none !important;
}

body:has(#layoutContainer[data-id="home"]) #headerContainer,
body:has(#layoutContainer[data-id="home"]) .Header__header {
  background: rgba(246, 242, 235, 0.98) !important;
  border-bottom: 1px solid var(--hf-line-soft) !important;
  box-shadow: 0 10px 28px rgba(35, 39, 36, 0.06) !important;
  z-index: 10 !important;
}

body:has(#layoutContainer[data-id="home"]) #headerContent,
body:has(#layoutContainer[data-id="home"]) .Header__searchSection {
  z-index: 2 !important;
  margin-bottom: 0 !important;
}

/* Search children must remain relative so the search icon and clear icon stay aligned. */
body:has(#layoutContainer[data-id="home"]) .SearchContainer__globalSearch,
body:has(#layoutContainer[data-id="home"]) .SearchContainer__formGroup,
body:has(#layoutContainer[data-id="home"]) .Input__positionRel,
body:has(#layoutContainer[data-id="home"]) .SearchContainer__searchIcon {
  position: relative !important;
}


/* Lock CTA directly under the hero. This is relative to the page container, not sticky header state. */
body:has(#layoutContainer[data-id="home"]) #footerContainer {
  display: block !important;
  position: absolute !important;
  top: 474px !important;
  left: 50% !important;
  right: auto !important;
  bottom: auto !important;
  transform: translateX(-50%) !important;
  width: calc(100% - 48px) !important;
  max-width: 1040px !important;
  margin: 0 !important;
  padding: 0 !important;
  z-index: 25 !important;
  background: transparent !important;
}

body:has(#layoutContainer[data-id="home"]) #footerContainer .Footer__footerContent {
  border-top: 0 !important;
  border-radius: 0 0 var(--hf-radius-lg) var(--hf-radius-lg) !important;
}

body:has(#layoutContainer[data-id="home"]) #footerContainer .Footer__footerInfo {
  min-height: 128px !important;
}

/* Reserve exact space under the absolute CTA so tiles never collide. */
body:has(#layoutContainer[data-id="home"]) #layoutContainer[data-id="home"] {
  padding-top: 218px !important;
  margin-top: 0 !important;
}

body:has(#layoutContainer[data-id="home"]) .ModuleCont__moduleCont {
  margin-top: 24px !important;
}

/* Homepage: popular articles must never reappear. */
body:has(#layoutContainer[data-id="home"]) .popularAricles,
body:has(#layoutContainer[data-id="home"]) .popularArticles,
body:has(#layoutContainer[data-id="home"]) .PopularArticles,
body:has(#layoutContainer[data-id="home"]) .WidgetContainer__boxSplit.popularAricles,
body:has(#layoutContainer[data-id="home"]) .WidgetContainer__boxSplit.popularArticles,
body:has(#layoutContainer[data-id="home"]) .WidgetContainer__boxSplit.PopularArticles {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  max-height: 0 !important;
  overflow: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Submit ticket page: only show Home in the top menu and remove right-rail articles/search. */
body:has(#layoutContainer[data-id="ticketForm"]) #portal_tabCases,
body:has(#layoutContainer[data-id="ticketForm"]) #portal_tabSolutions,
body:has(#layoutContainer[data-id="ticketForm"]) #logoutDetails,
body:has(#layoutContainer[data-id="ticketForm"]) #userPreference,
body:has(#layoutContainer[data-id="ticketForm"]) .TicketFormRightContainer__rightPanelDetail,
body:has(#layoutContainer[data-id="ticketForm"]) .TicketFormRightContainer__widgetRight,
body:has(#layoutContainer[data-id="ticketForm"]) .Layout__layout2,
body:has(#layoutContainer[data-id="ticketForm"]) .popularAricles,
body:has(#layoutContainer[data-id="ticketForm"]) .popularArticles,
body:has(#layoutContainer[data-id="ticketForm"]) .PopularArticles {
  display: none !important;
  visibility: hidden !important;
}

body:has(#layoutContainer[data-id="ticketForm"]) #navBarContainer {
  justify-content: flex-end !important;
}

body:has(#layoutContainer[data-id="ticketForm"]) #portal_tabHome {
  display: block !important;
  visibility: visible !important;
}

@media (max-width: 768px) {
  body:has(#layoutContainer[data-id="home"]) #footerContainer {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    transform: none !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 auto !important;
  }

  body:has(#layoutContainer[data-id="home"]) #layoutContainer[data-id="home"] {
    padding-top: 24px !important;
  }
}
.Footer__footerContent {
    margin: 0 -.9375rem;
    transform: translateY(80px) !important;
}
.AppContainer__breadCrumbs {
  display: none !important;
  height: 0;
  padding: 0;
  margin: 0;
}
.Footer__footerBg {
  background: none !important;
}
/* Hide original text */
label[for="productId"] {
  font-size: 0;
}

/* Insert new text */
label[for="productId"]::after {
  content: "Category";
  font-size: 14px; /* adjust to match */
  color: inherit;
}

.Header__logoImg img {
    max-height: 400px !important;
    width: auto !important;
}

#headerContainer {
  border-radius: 30px !important;
  overflow: hidden !important;
}
@media (max-width: 768px) {
  .Header__menuicon {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    align-items: center !important;
    justify-content: center !important;
  }

  #menuIconContainer {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  #menuBox {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
  }
}
@media (max-width: 768px) {
  /* Hide top Hammonds Tech Support text on mobile */
  .Header__name {
    display: none !important;
    visibility: hidden !important;
  }

  /* Make hamburger black */
  #menuBox,
  #menuBox::before,
  #menuBox::after {
    background-color: #000 !important;
  }



  
}
@media (max-width: 768px) {
  /* Hide accessibility / A+ button */
  .CustomizeContainer__aPlus,
  #userPreference_mobile,
  .Header__userPreference_mobile,
  .Header__userPreference {
    display: none !important;
    visibility: hidden !important;
  }
}