/* =====================================================================================
   PALMER / UBERMENU CSS (CLEANED + CONSOLIDATED)
   - Keeps your original base styles
   - Removes ONLY true duplicates that would override each other
   - Adds the missing LEFT TAB “visible” state styling (palmer-tab-visible)
   - Keeps OTHER NAV underlines black (only left-tab groups get the grey behavior)
   ===================================================================================== */

/* from custom-menu.css - menu style */
/* menu hover image style */
.ubermenu-custom-image .ubermenu-content-block.ubermenu-custom-content img {
  width: 400px;
  object-fit: cover;
}

/* Hover: remove hover background only
.ubermenu a:hover,
.ubermenu li.ubermenu-item a:hover {
  background: none !important;
}
*/

/* Active / Current page */
.ubermenu li.ubermenu-item.ubermenu-active > a,
.ubermenu li.ubermenu-item.ubermenu-current-menu-item > a,
.ubermenu li.ubermenu-item.ubermenu-current-page-ancestor > a {
  /*color: #87d2d2 !important;*/
  background: transparent !important;
}

/* nav */
.palmer_nav .palmer-container {
  max-width: 1440px;
  margin-inline: auto;
  padding-inline: 24px;
}

/* PRODUCT PAGE MARGIN AND PADDING */
.ubermenu-row-id-61656 { margin: 0px !important; }
.ubermenu-row-id-61700 { margin: 0px !important; }

.ubermenu-submenu-id-61664 { padding-bottom: 0px !important; }
.ubermenu-submenu-id-61655 { padding-bottom: 0px !important; }
.ubermenu-submenu-id-61677 { padding: 0 !important; }

@media (max-width: 1440px) {
  .ubermenu-submenu-id-61678 {
    padding-bottom: 8px !important;
    padding-top: 0px !important;
  }
}

@media (min-width: 1441px) {
  /* styles for screens larger than 1440px */
  .ubermenu-submenu-id-61678 {
    padding-bottom: 13% !important;
    padding-top: 0px !important;
  }
}

.ubermenu-submenu-id-61666 { padding: 0px !important; }
.ubermenu-submenu-id-61679 { padding-bottom: 0px !important; }
.ubermenu-submenu-id-61695 { padding: 0px !important; }
.ubermenu-submenu-id-61658 { padding: 0px !important; }
.ubermenu-submenu-id-61730 { padding: 0px !important; }
.ubermenu-submenu-id-61716 {
  padding: 0px !important;
  text-wrap-mode: nowrap;
}
.ubermenu-submenu-id-61709 { padding: 0px !important; }
.ubermenu-submenu-id-61702 { padding: 0px !important; }

/* nav structure */
.palmer_nav .palmer-navbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 100px;
  margin: 0 auto;
}

.palmer_nav .palmer-navbar.palmer-container {
  transition: top 0.5s ease;
  position: relative;
}

/* palmer top nav one */
.nav-wrapper {
  width: 100%;
}

.bg-dark {
  background-color: #242424;
  transition: transform 0.3s ease, opacity 0.3s ease;
  height: 50px; /* preserve layout */
  pointer-events: auto;
  opacity: 1;
}

.bg-dark.hidden {
  opacity: 0;
  transform: translateY(-100%);
  pointer-events: none;
}

.bg-light {
  background-color: #ffffff;
  width: 100%;
  transition: box-shadow 0.25s ease;
  /* transition: all ease 3s; */
}

.bg-light.fixed {
  box-shadow: 0px 4px 5px 0px rgba(0, 0, 0, 0.25);
  position: fixed;
  width: 100%;
  top: 0;
  left: 0;
  transition: box-shadow 0.35s ease;
  z-index: 999;
}

.palmer_nav .palmer-navbar.palmer-nav-navbar {
  height: 50px;
  color: #fff;
  transition: height 0.3s ease;
}

.palmer_nav .palmer-navbar.palmer-nav-navbar span.palmer-nav-intro-word {
  font-size: 19px;
  font-weight: 400;
  line-height: 27.46px;
  color: #fff;
}

.palmer_nav .palmer-navbar.palmer-nav-navbar a#palmer-TopNavbar-Link {
  text-decoration: underline;
  color: #fff;
  font-size: 19px;
  font-weight: 400;
  line-height: 27.46px;
}

.palmer_nav .palmer-navbar.palmer-nav-navbar .palmer-nav-topnav-left {
  font-size: 15px;
  display: flex;
  align-items: center;
}

.palmer_nav .palmer-navbar.palmer-nav-navbar .palmer-right-icon {
  cursor: pointer;
}

.palmer_nav .palmer-navbar.palmer-nav-navbar .palmer-nav-intro-desp {
  padding: 0 20px;
}

.palmer_nav
  .palmer-navbar.palmer-nav-navbar
  .palmer-nav-topnav-right
  .palmer-nav-topnav-list {
  display: flex;
  align-items: center;
  margin: 0;
}

.palmer_nav
  .palmer-navbar.palmer-nav-navbar
  .palmer-nav-topnav-right
  .palmer-nav-topnav-list
  a {
  color: #fff;
  font-size: 15px;
}

.palmer_nav
  .palmer-navbar.palmer-nav-navbar
  .palmer-nav-topnav-right
  .palmer-nav-topnav-list
  .palmer-nav-topnav-content {
  padding: 0 20px;
}

.palmer_nav
  .palmer-navbar.palmer-nav-navbar
  .palmer-nav-topnav-right
  .palmer-nav-topnav-list
  .palmer-nav-topnav-content.search-product
  .search-prod {
  display: flex;
  align-items: center;
  border-bottom: 2px solid white;
}

.palmer_nav
  .palmer-navbar.palmer-nav-navbar
  .palmer-nav-topnav-right
  .palmer-nav-topnav-list
  .palmer-nav-topnav-content.search-product
  .search-prod
  input {
  background-color: transparent;
  border: none;
  outline: none;
  color: #fff;
  padding: 0 35px 0 0;
}

.palmer_nav
  .palmer-navbar.palmer-nav-navbar
  .palmer-nav-topnav-right
  .palmer-nav-topnav-list
  .palmer-nav-topnav-content.search-product
  .search-prod
  input::placeholder {
  color: #fff;
  font-size: 12px;
  text-transform: uppercase;
  padding: 0;
  opacity: 1;
  display: block;
}

.palmer_nav
  .palmer-navbar.palmer-nav-navbar
  .palmer-nav-topnav-right
  .palmer-nav-topnav-list
  .palmer-nav-topnav-content.search-product
  i {
  font-size: 12px;
  height: 18px;
  cursor: pointer;
}

.palmer_nav
  .palmer-navbar.palmer-nav-navbar
  .palmer-nav-topnav-right
  .palmer-nav-topnav-list
  .palmer-nav-topnav-content
  a {
  text-transform: uppercase;
  font-size: 14px;
  font-weight: 500;
  line-height: 18.79px;
  text-decoration: none;
}

hr {
  margin: 0 auto;
  background: #000;
  width: 65.23px;
  height: 0.5px;
}

/* Desktop */
@media screen and (min-width: 769px) {
  .mobile-brand {
    display: none;
  }

  .palmer_nav .palmer-navbar.palmer-container,
  .ubermenu.ubermenu-main {
    position: unset;
  }

  #palmer_mobile_menu,
  .palmer-nav-intro-desp {
    display: none;
  }

  .palmer-nav-intro-desp.active {
    display: inline;
  }

  .palmer_nav .palmer-navbar {
    height: auto;
  }

  .palmer-navbar.palmer-main-header .palmer-navbar-left > a > .brand {
    margin: 15px 0;
  }

  .ubermenu-item.ubermenu-tabs.ubermenu-tabs-show-default:hover ul.ubermenu-tab-content-panel {
    left: auto;
    opacity: 1;
  }

  .uber-menu-link.ubermenu-item-has-children.ubermenu-item-level-0:hover ul > li > .ubermenu-tabs-group,
  .uber-menu-link.ubermenu-item-has-children.ubermenu-item-level-0:hover
    ul
    > li
    > .ubermenu-tabs-group
    > li
    > ul.ubermenu-tab-content-panel {
    opacity: 1;
    visibility: visible;
    left: auto;
  }

  .ubermenu-main .ubermenu-item-level-0 > .ubermenu-target {
    padding: 24px 28px;
  }

  .ubermenu-submenu.ubermenu-submenu-type-mega.ubermenu-submenu-drop {
    box-shadow: -5px 5px 10px rgba(0, 0, 0, 0.2),
      5px 5px 10px rgba(0, 0, 0, 0.2),
      0 5px 10px rgba(0, 0, 0, 0.2);
    border: none !important;
    overflow-y: hidden !important;
    padding: 20px 20px 0 20px;
    left: 50%;
    transform: translate(-50%, 0px);
    width: 100%;
  }

  .ubermenu.ubermenu-transition-slide
    .ubermenu-active
    > .ubermenu-submenu.ubermenu-submenu-type-mega {
    max-height: 700px;
  }

  .uber-menu-link .ubermenu-target-title {
    font-size: 17px;
    font-weight: 400;
    line-height: 28.9px;
    font-family: jost;
    color: #000;
  }

  .uber-menu-link i {
    display: none;
  }

  .uber-menu-link > a:hover {
    background-color: #fff;
  }

  #menu-item-54315 .ubermenu-tabs-group {
    width: 13% !important;
    max-width: none;
  }

  @media screen and (min-width: 2000px) {
    #menu-item-54315 .ubermenu-tabs-group {
      width: 11% !important;
      max-width: none;
    }
  }

  .ubermenu-tab-content-panel {
    width: 84% !important;
    padding-left: 20px !important;
  }

  .ubermenu .ubermenu-nav .ubermenu-tabs-group {
    width: 15%;
    border-right: 0 !important;
  }

  @media screen and (min-width: 2000px) {
    .ubermenu .ubermenu-nav .ubermenu-tabs-group {
      width: 12%;
      border-right: 0 !important;
    }
  }

  .ubermenu-tab-content-panel:before {
    content: "";
    position: absolute;
    width: 1px;
    height: 95%;
    z-index: 11;
    left: 0;
    background-color: rgba(36, 36, 36, 1);
    margin-left: 0px;
  }

  /* Submenu underline system (your black underlines for non-tab nav items) */
  li.uber-menu-link > a > span,
  li.uber-submenu-link > a > span,
  li.product-speciality-content > a > span,
  li.uber-submenu-content > a.ubermenu-target > span {
    position: relative;
    display: inline !important;
  }

  li.uber-submenu-link > a > span::after,
  li.product-speciality-content > a > span::after,
  li.uber-submenu-content > a.ubermenu-target > span::after,
  li.uber-menu-link > a.ubermenu-target > span::after {
    position: absolute;
    content: "";
    left: 0;
    bottom: 0;
    width: 0;
  }

  li.uber-menu-link > a.ubermenu-target > span::after,
  li.uber-submenu-link > a > span::after,
  li.product-speciality-content > a > span::after {
    background-color: #000;
  }

  li.uber-submenu-link > a > span:hover::after,
  li.uber-submenu-link.ubermenu-active > a > span::after,
  li.product-speciality-content > a > span:hover::after,
  li.uber-submenu-content > a.ubermenu-target > span:hover::after,
  li.uber-menu-link > a.ubermenu-target > span:hover::after,
  li.uber-menu-link.ubermenu-active > a > span::after {
    width: 100%;
  }

  .uber-submenu-link a.ubermenu-item-layout-text_only .ubermenu-target-text {
    font-family: "Jost";
    font-size: 14px;
    font-weight: 600;
    line-height: 19.6px;
    color: inherit;
    text-transform: uppercase;
    letter-spacing: 1px;
    cursor: pointer;
    text-shadow: -0.25px -0.25px 0 transparent, 0.25px 0.25px transparent;
    text-decoration: none;
    border-bottom: 2px solid transparent;
    margin: 0;
  }

  .ubermenu.ubermenu-submenu-indicator-closes .ubermenu-sub-indicator-close {
    display: none !important;
  }

  /* submenu title style */
  .uber-submenu-content-title a.ubermenu-target {
    width: 100%;
  }

  .uber-submenu-content-title a.ubermenu-target .ubermenu-target-title {
    font-family: "Jost";
    font-size: 14px;
    font-weight: 600;
    line-height: 19.6px;
    letter-spacing: 1px;
    text-decoration: none !important;
    text-transform: uppercase;
    cursor: pointer;
    text-shadow: -0.25px -0.25px 0 transparent, 0.25px 0.25px transparent;
    border-bottom: 2px solid transparent;
    margin: 0;
  }

  .ubermenu .ubermenu-nav .classic-style-col { width: 35%; }
  .ubermenu .ubermenu-nav .traditional-style-col { width: 65%; }

  /* submenu title content links style */
  .uber-submenu-content a.ubermenu-target .ubermenu-target-title {
    font-family: "Jost";
    font-size: 16px;
    font-weight: 300;
    line-height: 22.4px;
    color: #000;
    text-transform: none;
    cursor: pointer;
    text-shadow: -0.25px -0.25px 0 transparent, 0.25px 0.25px transparent;
    text-decoration: none;
    border-bottom: 2px solid transparent;
    margin: 0;
  }

  /* custom image */
  .ubermenu .ubermenu-nav .ubrmenu-custom-image {
    width: 31%;
    float: right;
    margin-right: -1px;
  }

  .ubermenu .ubermenu-nav .ubermenu-custom-menu-sublinks {
    width: 70%;
    padding-top: 6px;
  }

  .ubermenu-submenu .ubermenu-divider {
    display: none;
  }

  /* new product styling */
  .ubermenu .ubermenu-nav .product-image-container { width: 30%; }
  .ubermenu .ubermenu-nav .product-image-container-2 { width: fit-content; }
  .ubermenu .ubermenu-nav .product-content-container { width: 70%; }

  .ubermenu .ubermenu-nav .product-column-one { width: 24%; }
  .ubermenu .ubermenu-nav .product-column-two { width: 58%; }
  .ubermenu .ubermenu-nav .product-column-three { width: 18%; }

  .ubermenu .ubermenu-nav .product-menu-tab .ubermenu-tabs-group {
    padding-left: 20px !important;
  }

  .ubermenu .ubermenu-nav .product-inner-col-one { width: 50%; }
  .ubermenu .ubermenu-nav .product-inner-col-two { width: 50%; }

  .ubermenu .ubermenu-nav .product-estimate-col { padding-bottom: 15px; }

  /* adding border before col */
  .uber-submenu-content-title.uber-submenu-content-border {
    display: flex !important;
    flex-direction: column;
  }

  .uber-submenu-content-title.uber-submenu-content-border:before {
    content: "";
    position: absolute;
    width: 1px;
    height: 55%;
    z-index: 11;
    background-color: #cccccc;
    margin-left: -4px;
  }

  /* About */
  .ubermenu .about-stack-menu .ubermenu-submenu { width: 135px; }
  .ubermenu .ubermenu-submenu .palmer-stack-menu { min-width: auto !important; }

  .ubermenu-submenu .palmer-stack-menu a.ubermenu-target {
    padding: 10px 20px;
    text-align: center;
  }

  .ubermenu .ubermenu-nav .ubermenu-image-container { width: 24% !important; }
  .ubermenu .ubermenu-nav .product-estimate-col { width: 19%; }
  .ubermenu .ubermenu-nav .product-estimate-col-2 { width: 19%; }
  .ubermenu .ubermenu-nav .product-estimate-col-3 { width: 37%; }
  .ubermenu .ubermenu-nav .product-estimate-col-4 { width: 18.2%; }

  .ubermenu .about-stack-menu .ubermenu-divider { display: block; padding: 0; }
  .ubermenu .about-stack-menu .ubermenu-divider hr { margin: 0 auto; border-color: #000; }

  .uber-submenu-content-title.uber-submenu-content-border-sinkleg-1::before,
  .uber-submenu-content-title.uber-submenu-content-border-sinkleg-2::before,
  .uber-submenu-content-title.uber-submenu-content-border-shelving::before,
  .uber-submenu-content-title.uber-submenu-content-border-specialty::before {
    content: "";
    position: absolute;
    width: 0.05rem;
    z-index: 11;
    background-color: #cccccc;
    margin-left: -4px;
  }

  .uber-submenu-content-title.uber-submenu-content-border-sinkleg-1::before { height: 45%; }
  .uber-submenu-content-title.uber-submenu-content-border-sinkleg-2::before { height: 80px; }
  .uber-submenu-content-title.uber-submenu-content-border-shelving::before { height: 45%; }
  .uber-submenu-content-title.uber-submenu-content-border-specialty::before { height: 25%; }

  .mobile-search { display: none; }
}

/* Mobile Menu */
@media screen and (max-width: 769px) {
  .palmer-navbar.palmer-container.palmer-nav-navbar {
    display: block !important;
  }

  .palmer_nav .palmer-navbar.palmer-nav-navbar .palmer-nav-topnav-left {
    display: flex;
    justify-content: center;
    height: 50px;
    align-items: center;
  }

  span.palmer-nav-intro-desp.active { display: inline; }
  span.palmer-nav-intro-desp { display: none; }

  .mobile-brand { display: block; }
  .brand { display: none; }

  #palmer_main_menu { display: none; }
  #palmer_mobile_menu { display: block; }

  .uber-menu-link .ubermenu-target-title,
  .uber-menu-link .login.menu-link {
    font-size: 20px;
    font-weight: 400;
    line-height: 28.9px;
    font-family: jost;
    color: #000;
  }

  .uber-submenu-content-title a.ubermenu-target .ubermenu-target-title {
    font-family: "Jost";
    font-size: 14px;
    font-weight: 600;
    line-height: 19.6px;
    letter-spacing: 1px;
    text-decoration: none !important;
    text-transform: uppercase;
    cursor: pointer;
    text-shadow: -0.25px -0.25px 0 transparent, 0.25px 0.25px transparent;
    border-bottom: 2px solid transparent;
    margin: 0;
  }

  .uber-submenu-content a.ubermenu-target .ubermenu-target-title {
    font-family: "Jost";
    font-size: 16px;
    font-weight: 300;
    line-height: 22.4px;
    color: #000;
    text-transform: none;
    cursor: pointer;
    text-shadow: -0.25px -0.25px 0 transparent, 0.25px 0.25px transparent;
    text-decoration: none;
    border-bottom: 2px solid transparent;
    margin: 0;
  }

  .ubermenu-responsive-default.ubermenu-responsive-single-column-subs
    .ubermenu-submenu
    .ubermenu-item {
    min-width: 80% !important;
    width: calc(100% - 15px) !important;
  }

  .ubermenu-responsive-default.ubermenu.ubermenu-mobile-modal .ubermenu-nav {
    overflow-x: hidden !important;
  }

  .ubermenu-skin-white.ubermenu-responsive-toggle i.fas.fa-bars { color: #000; }
  .ubermenu-skin-white.ubermenu-responsive-toggle { border: none; }

  .ubermenu-responsive-default.ubermenu.ubermenu-mobile-modal {
    top: 10.1%;
    padding: 0 15px;
  }

  .uber-menu-link.ubermenu-item {
    padding-right: 10px;
    border-bottom: 1px solid rgba(140, 140, 140, 0.4) !important;
  }

  .ubermenu-sub-indicator {
    font-size: 20px;
    color: #000;
  }

  .ubermenu-scroll { top: 64px; }

  .ubermenu.ubermenu-mobile-modal {
    top: 64px;
    transition: all 0.3s ease-in-out;
  }

  html, body { overscroll-behavior: none; }

  @media (max-width: 768px) {
    .ubermenu-mobile-modal {
      overflow-y: auto;
      height: 100vh;
      -webkit-overflow-scrolling: touch;
    }
  }

  .ubermenu-mobile-footer { display: none !important; }
  .desktop-search { display: none; }
  .mobile-search { display: block; }

  .palmer_nav .palmer-navbar-left { flex: 0 0 12%; }

  .palmer-nav-topnav-list {
    margin: 0;
    list-style: none;
  }

  #mobile-searchBar::placeholder,
  #searchBar::placeholder {
    color: rgba(25, 24, 24, 0.6);
    font-size: 14px;
    font-weight: 400;
    line-height: 18.6px;
    font-family: "Jost";
    text-transform: uppercase;
  }

  #mobile-searchBar {
    border-color: #fff !important;
    color: rgba(25, 24, 24, 0.6);
    font-size: 14px;
    font-weight: 400;
    line-height: 18.6px;
    font-family: "Jost";
    padding: 0 !important;
    padding-right: 20px !important;
  }

  #searchBtn { color: rgba(25, 24, 24, 0.6); }

  .search-form {
    border-bottom: 1px solid rgba(25, 24, 24, 0.6);
    margin: 0;
    display: flex;
  }

  #mobile-searchBtn {
    padding: 0;
    background: #fff;
  }

  .uber-menu-link a.logout-link.menu-link {
    font-size: 20px;
    font-weight: 400;
    line-height: 28.9px;
    font-family: jost;
    color: #000;
    text-transform: capitalize;
  }

  .search-banner { flex-direction: column; }

  h1.search-banner-heading {
    font-size: 1.95rem;
    margin-top: 0;
    line-height: 40px;
    text-align: left;
  }

  .search-banner .search-banner-content {
    padding: 30px;
    min-height: auto;
    align-items: flex-start;
  }

  p.search-banner-text { text-align: left; }

  .search-result-container .search-results-list li a { font-size: 15px; }
  .search-result-container .search-results-title { font-size: 25px; }

  .mobile-search #search-mobile-popup .suggestion-box {
    right: 30%;
    left: 10%;
    width: 80%;
    padding-top: 20px;
  }

  #search-mobile-popup .suggestion-box h4 {
    font-size: 18px;
    padding-bottom: 8px;
  }

  #search-mobile-popup .suggestion-box a { font-size: 14px; }

  #search-mobile-popup .suggestion-box .view-all a { font-size: 16px; }
  #search-mobile-popup .suggestion-box .view-all i {
    font-size: 13px;
    margin-bottom: 5px;
  }

  .palmer_nav .palmer-container {
    padding-inline: 1rem;
    height: 4rem;
    transition: all 0.3s ease-in-out;
  }
}

/* Tab Menu */
@media (min-width: 769px) and (max-width: 1200px) {
  .palmer-navbar.palmer-container.palmer-nav-navbar { display: flex !important; }

  #searchBar::placeholder { font-size: 10px; }

  .palmer_nav .palmer-navbar.palmer-nav-navbar .palmer-nav-topnav-right .palmer-nav-topnav-list {
    list-style: none;
  }

  .palmer_nav .palmer-navbar.palmer-nav-navbar a#palmer-TopNavbar-Link,
  .palmer_nav .palmer-navbar.palmer-nav-navbar span.palmer-nav-intro-word {
    font-size: 13px;
  }

  .palmer-right-icon { width: 14px; height: 14px; }

  .palmer_nav
    .palmer-navbar.palmer-nav-navbar
    .palmer-nav-topnav-right
    .palmer-nav-topnav-list
    .palmer-nav-topnav-content {
    padding: 0 10px;
  }

  .palmer_nav .palmer-navbar.palmer-nav-navbar .palmer-nav-intro-desp { padding: 0 7px; }

  .palmer_nav
    .palmer-navbar.palmer-nav-navbar
    .palmer-nav-topnav-right
    .palmer-nav-topnav-list
    .palmer-nav-topnav-content
    a {
    font-size: 10px;
  }

  .palmer_nav
    .palmer-navbar.palmer-nav-navbar
    .palmer-nav-topnav-right
    .palmer-nav-topnav-list
    .palmer-nav-topnav-content.search-product
    .search-prod
    input {
    padding: 0 5px 0 0;
  }

  .mobile-brand { display: none; }
  .brand { display: block; }
  #palmer_main_menu { display: block; }
  #palmer_mobile_menu { display: none; }

  .palmer_nav .palmer-navbar-left {
    flex: 0 0 30%;
    transition: all 0.3s ease-in-out;
  }

  .uber-menu-link .ubermenu-target-title { font-size: 13px; }

  .uber-submenu-content-title a.ubermenu-target .ubermenu-target-title,
  .uber-submenu-link a.ubermenu-item-layout-text_only .ubermenu-target-text {
    font-size: 11px;
    letter-spacing: 0.5px;
  }

  .ubermenu-main .ubermenu-item-level-0 > .ubermenu-target { padding: 24px 10px; }
  .ubermenu-submenu-type-flyout.ubermenu-submenu-drop { right: 10px; }
  .ubermenu-tab-image-container { display: none !important; }

  .ubermenu .ubermenu-nav .product-estimate-col { width: 25%; }

  .uber-submenu-content-title.uber-submenu-content-border:before { height: 80%; }

  .ubermenu .ubermenu-nav .product-content-container,
  .ubermenu .ubermenu-nav .ubermenu-custom-menu-sublinks {
    width: 100%;
    padding-top: 0px;
  }

  .uber-submenu-content-title.uber-submenu-content-border-sinkleg-2::before {
    height: 80px !important;
  }

  .uber-submenu-content-title.uber-submenu-content-border-shelving::before,
  .uber-submenu-content-title.uber-submenu-content-border-specialty::before {
    height: 75%;
  }

  .product-column-two.ubermenu-item.ubermenu-item-type-custom ul { padding-bottom: 3px; }

  .ubermenu .ubermenu-nav .product-menu-tab .ubermenu-tabs-group { padding-left: 0 !important; }

  .ubermenu-tab-content-panel {
    width: 86% !important;
    padding-left: 10px !important;
  }

  .ubermenu .ubermenu-nav .product-column-one { width: 20%; }
  .ubermenu .ubermenu-nav .product-column-two { width: 66%; }
  .ubermenu .ubermenu-nav .product-inner-col-one,
  .ubermenu .ubermenu-nav .product-inner-col-two { width: 49%; }
  .ubermenu .ubermenu-nav .product-column-three { width: 14%; }

  .ubermenu .ubermenu-nav .ubermenu-tabs-group { width: 13.66%; }

  .ubermenu .ubermenu-submenu-type-stack > .ubermenu-item-normal > .ubermenu-target {
    padding-top: 4px;
    padding-bottom: 3px;
  }

  .suggestion-box { width: 35%; }

  .palmer-navbar-left img.brand {
    width: 100%;
    transition: all 0.3s ease-in-out;
  }

  .palmer_nav .palmer-navbar.palmer-nav-navbar .palmer-nav-topnav-right .palmer-nav-topnav-list { padding: 0; }
  .palmer_nav .palmer-navbar.palmer-nav-navbar .palmer-nav-topnav-left { font-size: 13px; }

  .ubermenu .about-stack-menu .ubermenu-submenu { width: 105px; }
}

/* for ubermenu about dropdown */
@media (max-width: 1501px) {
  .about-stack-menu.ubermenu-item.ubermenu-item-type-custom
    .ubermenu-submenu-type-flyout.ubermenu-submenu-drop {
    right: 20px;
  }
}

/* search popup */
.ubermenu .ubermenu-current-menu-item {
  font-weight: bold;
  border-radius: 4px;
}

.suggestion-box {
  background: #fff;
  padding: 1% 2%;
  position: fixed;
  top: 6%;
  right: 0;
  z-index: 99;
  width: 26%;
}

#search-mobile-popup .suggestion-box {
  background: #fff;
  padding: 1% 2%;
  position: fixed;
  top: auto;
  right: 30%;
  left: 30%;
  z-index: 99;
  width: 40%;
}

.search-banner .search-banner-content { background-color: #f7f7f7; }

.search-popup .suggestion-box h4 {
  font-family: "Baskervville", serif !important;
  font-weight: 400;
  font-size: 24px;
  color: #191818;
  padding-bottom: 18px;
}

.search-popup .suggestion-box h4 span { font-style: italic; }
.search-popup .suggestion-box ul { margin: 0; }
.search-popup .suggestion-box ul li { display: block; }

.search-popup .suggestion-box a {
  font-family: Jost;
  font-weight: 400;
  font-size: 16px;
  line-height: 2;
}

.search-popup .suggestion-box .view-all {
  padding-top: 10px;
  margin: auto;
}

.search-popup .suggestion-box .view-all a {
  font-family: Jost;
  font-weight: 400;
  font-size: 22px;
}

.search-product form#searchform {
  margin: 0;
  display: flex;
}

.search-product button#searchBtn {
  padding: 0;
  background: transparent;
  border: none;
}

/* Hide bg-dark menu (top menu) on Mobile */
@media (max-width: 768px) {
  .bg-dark { display: none !important; }
}

/* Active State for Menu */
.ubermenu .ubermenu-target.ubermenu-item-active { color: #87d2d2 !important; }

/* Center About Us Dropdown */
.ubermenu li.center-dropdown { position: relative; }
.ubermenu li.center-dropdown > .ubermenu-submenu {
  left: 50% !important;
  transform: translateX(-50%);
  right: auto !important;
}

/* =====================================================================================
   HOVER STATE MENU CODE (leaf underline rules)
   ===================================================================================== */

/* underline ONLY current product/menu leaf items */
.ubermenu li.ubermenu-current-menu-item:not(.ubermenu-item-has-children) > a.ubermenu-target,
.ubermenu li.ubermenu-current-menu-item:not(.ubermenu-item-has-children) > a.ubermenu-target .ubermenu-target-title {
  text-decoration: underline !important;
  text-decoration-color: #000 !important;
  text-underline-offset: 4px;
  font-weight: 400;
}

/* hover -> weight 400 for leaf items only */
.ubermenu li.ubermenu-item:not(.ubermenu-item-has-children) > a.ubermenu-target:hover,
.ubermenu li.ubermenu-item:not(.ubermenu-item-has-children) > a.ubermenu-target:hover .ubermenu-target-title {
  font-weight: 400 !important;
}

/* =====================================================================================
   PAGE-SPECIFIC: Styles Gallery / Shelving / Supports / Options
   ===================================================================================== */

body[class*="styles-gallery"] #menu-item-54392 .uber-submenu-content a.ubermenu-target,
body[class*="styles-gallery"] #menu-item-54392 .uber-submenu-content a.ubermenu-target .ubermenu-target-title {
  text-decoration: none !important;
  font-weight: 300;
}

body[class*="styles-gallery"] #menu-item-54392 > a.ubermenu-target,
body[class*="styles-gallery"] #menu-item-54392 > a.ubermenu-target .ubermenu-target-title {
  text-decoration: underline !important;
  text-decoration-color: #000 !important;
  text-underline-offset: 4px;
  font-weight: 600 !important;
}

body[class*="vanity-shelving-options"] #menu-item-54364 .uber-submenu-content a.ubermenu-target,
body[class*="vanity-shelving-options"] #menu-item-54364 .uber-submenu-content a.ubermenu-target .ubermenu-target-title {
  text-decoration: none !important;
  font-weight: 300;
}

body[class*="vanity-shelving-options"] #menu-item-54364 > a.ubermenu-target,
body[class*="vanity-shelving-options"] #menu-item-54364 > a.ubermenu-target .ubermenu-target-title {
  text-decoration: underline !important;
  text-decoration-color: #000 !important;
  text-underline-offset: 4px;
  font-weight: 600 !important;
}

body[class*="shelf-support"] #menu-item-54371 .uber-submenu-content a.ubermenu-target,
body[class*="shelf-support"] #menu-item-54371 .uber-submenu-content a.ubermenu-target .ubermenu-target-title {
  text-decoration: none !important;
  font-weight: 300;
}

body[class*="shelf-support"] #menu-item-54371 > a.ubermenu-target,
body[class*="shelf-support"] #menu-item-54371 > a.ubermenu-target .ubermenu-target-title {
  text-decoration: underline !important;
  text-decoration-color: #000 !important;
  text-underline-offset: 4px;
  font-weight: 600 !important;
}

body[class*="options-and-accessories"] #menu-item-54378 .uber-submenu-content a.ubermenu-target,
body[class*="options-and-accessories"] #menu-item-54378 .uber-submenu-content a.ubermenu-target .ubermenu-target-title {
  text-decoration: none !important;
  font-weight: 300;
}

body[class*="options-and-accessories"] #menu-item-54378 > a.ubermenu-target,
body[class*="options-and-accessories"] #menu-item-54378 > a.ubermenu-target .ubermenu-target-title {
  text-decoration: underline !important;
  text-decoration-color: #000 !important;
  text-underline-offset: 4px;
  font-weight: 600 !important;
}

/* =====================================================================================
   LEFT TAB UNDERLINE (current/ancestor) – keeps underline logic, but color may be overridden below
   ===================================================================================== */

.ubermenu li.ubermenu-tab.ubermenu-current-menu-ancestor > a.ubermenu-target,
.ubermenu li.ubermenu-tab.ubermenu-current-menu-ancestor > a.ubermenu-target .ubermenu-target-title,
.ubermenu li.ubermenu-tab.ubermenu-current-menu-ancestor > a.ubermenu-target .ubermenu-target-text,
.ubermenu li.ubermenu-tab.ubermenu-current-menu-item > a.ubermenu-target,
.ubermenu li.ubermenu-tab.ubermenu-current-menu-item > a.ubermenu-target .ubermenu-target-title,
.ubermenu li.ubermenu-tab.ubermenu-current-menu-item > a.ubermenu-target .ubermenu-target-text {
  text-decoration: underline;
  text-decoration-color: #000;
  text-underline-offset: 4px;
}

/* =====================================================================================
   LEFT TABS VISUAL STATE (Products + Inspiration tab groups)
   - Default: grey text
   - Hover: black
   - Visible tab (.palmer-tab-visible): black (JS adds this)
   - Current/ancestor underline: grey by default, black when visible/hovered
   ===================================================================================== */

/* 1) Default: grey text inside ANY UberMenu tabs-group */
.ubermenu.ubermenu-main .ubermenu-tabs-group > li.ubermenu-tab > a.ubermenu-target,
.ubermenu.ubermenu-main .ubermenu-tabs-group > li.ubermenu-tab > a.ubermenu-target .ubermenu-target-title,
.ubermenu.ubermenu-main .ubermenu-tabs-group > li.ubermenu-tab > a.ubermenu-target .ubermenu-target-text {
  color: rgba(0, 0, 0, 0.40) !important;
}

/* 2) Hovered tab: black */
.ubermenu.ubermenu-main .ubermenu-tabs-group > li.ubermenu-tab:hover > a.ubermenu-target,
.ubermenu.ubermenu-main .ubermenu-tabs-group > li.ubermenu-tab:hover > a.ubermenu-target .ubermenu-target-title,
.ubermenu.ubermenu-main .ubermenu-tabs-group > li.ubermenu-tab:hover > a.ubermenu-target .ubermenu-target-text {
  color: #000 !important;
  opacity: 1 !important;
}

/* 3) Visible tab (synced via JS): black */
.ubermenu.ubermenu-main .ubermenu-tabs-group > li.ubermenu-tab.palmer-tab-visible > a.ubermenu-target,
.ubermenu.ubermenu-main .ubermenu-tabs-group > li.ubermenu-tab.palmer-tab-visible > a.ubermenu-target .ubermenu-target-title,
.ubermenu.ubermenu-main .ubermenu-tabs-group > li.ubermenu-tab.palmer-tab-visible > a.ubermenu-target .ubermenu-target-text {
  color: #000 !important;
  opacity: 1 !important;
}

/* 4) Current-page underline on LEFT TABS only: grey by default */
.ubermenu.ubermenu-main .ubermenu-tabs-group > li.ubermenu-tab.ubermenu-current-menu-item > a.ubermenu-target,
.ubermenu.ubermenu-main .ubermenu-tabs-group > li.ubermenu-tab.ubermenu-current-menu-ancestor > a.ubermenu-target,
.ubermenu.ubermenu-main .ubermenu-tabs-group > li.ubermenu-tab.ubermenu-current-menu-item > a.ubermenu-target .ubermenu-target-title,
.ubermenu.ubermenu-main .ubermenu-tabs-group > li.ubermenu-tab.ubermenu-current-menu-ancestor > a.ubermenu-target .ubermenu-target-title,
.ubermenu.ubermenu-main .ubermenu-tabs-group > li.ubermenu-tab.ubermenu-current-menu-item > a.ubermenu-target .ubermenu-target-text,
.ubermenu.ubermenu-main .ubermenu-tabs-group > li.ubermenu-tab.ubermenu-current-menu-ancestor > a.ubermenu-target .ubermenu-target-text {
  text-decoration-color: rgba(0, 0, 0, 0.40) !important;
}

/* 5) If current-page tab is also visible or hovered, underline turns black */
.ubermenu.ubermenu-main .ubermenu-tabs-group > li.ubermenu-tab.ubermenu-current-menu-item.palmer-tab-visible > a.ubermenu-target,
.ubermenu.ubermenu-main .ubermenu-tabs-group > li.ubermenu-tab.ubermenu-current-menu-ancestor.palmer-tab-visible > a.ubermenu-target,
.ubermenu.ubermenu-main .ubermenu-tabs-group > li.ubermenu-tab.ubermenu-current-menu-item:hover > a.ubermenu-target,
.ubermenu.ubermenu-main .ubermenu-tabs-group > li.ubermenu-tab.ubermenu-current-menu-ancestor:hover > a.ubermenu-target,
.ubermenu.ubermenu-main .ubermenu-tabs-group > li.ubermenu-tab.ubermenu-current-menu-item.palmer-tab-visible > a.ubermenu-target .ubermenu-target-title,
.ubermenu.ubermenu-main .ubermenu-tabs-group > li.ubermenu-tab.ubermenu-current-menu-ancestor.palmer-tab-visible > a.ubermenu-target .ubermenu-target-title,
.ubermenu.ubermenu-main .ubermenu-tabs-group > li.ubermenu-tab.ubermenu-current-menu-item:hover > a.ubermenu-target .ubermenu-target-title,
.ubermenu.ubermenu-main .ubermenu-tabs-group > li.ubermenu-tab.ubermenu-current-menu-ancestor:hover > a.ubermenu-target .ubermenu-target-title,
.ubermenu.ubermenu-main .ubermenu-tabs-group > li.ubermenu-tab.ubermenu-current-menu-item.palmer-tab-visible > a.ubermenu-target .ubermenu-target-text,
.ubermenu.ubermenu-main .ubermenu-tabs-group > li.ubermenu-tab.ubermenu-current-menu-ancestor.palmer-tab-visible > a.ubermenu-target .ubermenu-target-text,
.ubermenu.ubermenu-main .ubermenu-tabs-group > li.ubermenu-tab.ubermenu-current-menu-item:hover > a.ubermenu-target .ubermenu-target-text,
.ubermenu.ubermenu-main .ubermenu-tabs-group > li.ubermenu-tab.ubermenu-current-menu-ancestor:hover > a.ubermenu-target .ubermenu-target-text {
  text-decoration-color: #000 !important;
}

/* NOTE: we intentionally do NOT touch your other submenu underline pseudo-elements.
   Those remain black everywhere, as requested. */

/* Hovered tab stays black (extra safety, scoped to open mega) */
.ubermenu.ubermenu-main li.ubermenu-item-level-0.ubermenu-active
  > .ubermenu-submenu.ubermenu-submenu-type-mega
  .ubermenu-tabs-group
  > li.ubermenu-tab:hover
  > a.ubermenu-target,
.ubermenu.ubermenu-main li.ubermenu-item-level-0.ubermenu-active
  > .ubermenu-submenu.ubermenu-submenu-type-mega
  .ubermenu-tabs-group
  > li.ubermenu-tab:hover
  > a.ubermenu-target .ubermenu-target-title,
.ubermenu.ubermenu-main li.ubermenu-item-level-0.ubermenu-active
  > .ubermenu-submenu.ubermenu-submenu-type-mega
  .ubermenu-tabs-group
  > li.ubermenu-tab:hover
  > a.ubermenu-target .ubermenu-target-text {
  color: #000 !important;
}

/* NO-CLICK = only affects the label itself (not its submenu links) */
.ubermenu li.no-click > a,
.ubermenu li.no-click > a *,
.ubermenu li.no-click > span,
.ubermenu li.no-click > span * {
  cursor: default !important;
}

/* Prevent underline on hover for top-level menu items */
.ubermenu li.ubermenu-item-level-0 > a.ubermenu-target:hover {
  text-decoration: none;
}

/* Underline TOP-LEVEL "Products" ONLY when it is current/ancestor (not hover) */
.ubermenu li.ubermenu-item-level-0.ubermenu-current-menu-ancestor > a.ubermenu-target,
.ubermenu li.ubermenu-item-level-0.ubermenu-current-menu-item > a.ubermenu-target {
  text-decoration: underline;
  text-decoration-color: #000;
  text-underline-offset: 4px;
  text-decoration-thickness: 1.25px;

}

/* Top Black Menu Active State */
.palmer_nav .palmer-nav-topnav-right .palmer-nav-topnav-list a.palmer-topnav-active {
  color: #87d2d2 !important;
}

/* Top bar hover = same as active */
.palmer_nav .palmer-nav-topnav-right .palmer-nav-topnav-list a:hover,
.palmer_nav .palmer-navbar.palmer-nav-navbar a#palmer-TopNavbar-Link:hover,
.palmer_nav .palmer-nav-topnav-right .palmer-nav-topnav-list a:focus-visible {
  color: #87d2d2 !important;
}

/* =====================================================================================
   CONTACT US PAGE: remove underline/active styling in WHITE UberMenu nav
   ===================================================================================== */

body[class*="contact-us"] .ubermenu li.uber-menu-link.ubermenu-active > a > span::after,
body[class*="contact-us"] .ubermenu li.uber-menu-link.ubermenu-current-menu-item > a > span::after,
body[class*="contact-us"] .ubermenu li.uber-menu-link.ubermenu-current-menu-ancestor > a > span::after,
body[class*="contact-us"] .ubermenu li.uber-menu-link.ubermenu-current-page-ancestor > a > span::after {
  width: 0 !important;
}

/* If any underline is coming from border-bottom on those same items, kill that too */
body[class*="contact-us"] .ubermenu li.uber-menu-link.ubermenu-active > a .ubermenu-target-title,
body[class*="contact-us"] .ubermenu li.uber-menu-link.ubermenu-current-menu-item > a .ubermenu-target-title,
body[class*="contact-us"] .ubermenu li.uber-menu-link.ubermenu-current-menu-ancestor > a .ubermenu-target-title,
body[class*="contact-us"] .ubermenu li.uber-menu-link.ubermenu-current-page-ancestor > a .ubermenu-target-title {
  border-bottom-color: transparent !important;
  text-decoration: none !important;
}

body[class*="contact-us"] #menu-item-61783 > a,
body[class*="contact-us"] #menu-item-61783 > a * {
  text-decoration: none !important;
  border-bottom: 0 !important;
}

body[class*="contact-us"] #menu-item-61783 > a::after,
body[class*="contact-us"] #menu-item-61783 > a *::after {
  content: none !important;
  display: none !important;
  width: 0 !important;
}

body[class*="contact-us"] #menu-item-61866 > a,
body[class*="contact-us"] #menu-item-61866 > a * {
  text-decoration: none !important;
  border-bottom: 0 !important;
  font-weight: 300;
}

body[class*="contact-us"] #menu-item-61866 > a::after,
body[class*="contact-us"] #menu-item-61866 > a *::after {
  content: none !important;
  display: none !important;
  width: 0 !important;
}

body[class*="contact-us"] #menu-item-61791 > a,
body[class*="contact-us"] #menu-item-61791 > a * {
  text-decoration: none !important;
  border-bottom: 0 !important;
  font-weight: 300;
}

body[class*="contact-us"] #menu-item-61791 > a::after,
body[class*="contact-us"] #menu-item-61791 > a *::after {
  content: none !important;
  display: none !important;
  width: 0 !important;
}

/* Kill #eee highlight on top-level UberMenu items when focus/active happens */
.ubermenu.ubermenu-main li.ubermenu-item-level-0:not(.ubermenu-active) > a.ubermenu-target,
.ubermenu.ubermenu-main li.ubermenu-item-level-0:not(.ubermenu-active) > a.ubermenu-target:focus,
.ubermenu.ubermenu-main li.ubermenu-item-level-0:not(.ubermenu-active) > a.ubermenu-target:focus-visible,
.ubermenu.ubermenu-main li.ubermenu-item-level-0:not(.ubermenu-active) > a.ubermenu-target:active {
  background-color: transparent !important;
  background: transparent !important;
}

li.uber-menu-link.ubermenu-active > a > span::after { width: 100%; }

/* =====================================================================================
   OPEN MENU = GREY CONTEXT STATE (single copy)
   ===================================================================================== */

/* 1. Grey background for the ENTIRE open dropdown */
.ubermenu-submenu-drop {
  background-color: #f6f6f6 !important;
}

/* 2. Grey background for the TOP-LEVEL item that opened the menu */
.ubermenu li.ubermenu-item-level-0.ubermenu-active > a.ubermenu-target {
  background-color: #f6f6f6 !important;
}

/* 3. Keep text color normal (do NOT dim text) */
.ubermenu li.ubermenu-item-level-0.ubermenu-active > a.ubermenu-target,
.ubermenu li.ubermenu-item-level-0.ubermenu-active > a.ubermenu-target .ubermenu-target-title {
  color: #000 !important;
}

/* Hover grey for top-level items with NO submenu (Hospitality + Contact) */
#menu-item-61824:hover > a.ubermenu-target,
#menu-item-61825:hover > a.ubermenu-target {
  background-color: #f6f6f6 !important;
}

#menu-item-61824 > a.ubermenu-target,
#menu-item-61825 > a.ubermenu-target {
  transition: background-color .75s ease !important;
}

/* MEGA MENU: NO INTERNAL SCROLL KEEP SLIDE OPEN */
.ubermenu.ubermenu-transition-slide
  .ubermenu-active
  > .ubermenu-submenu.ubermenu-submenu-type-mega.ubermenu-submenu-drop {
  max-height: 1200px !important;
  overflow-y: hidden !important;
  overflow-x: hidden !important;
}

/* Hospitality current item: do NOT show How To Buy as active */
.ubermenu.ubermenu-main:has(#menu-item-61824.ubermenu-current-menu-item) #menu-item-61783 > a.ubermenu-target,
.ubermenu.ubermenu-main:has(#menu-item-61824.ubermenu-current-menu-item)
  #menu-item-61783
  > a.ubermenu-target
  .ubermenu-target-title {
  text-decoration: none !important;
}

.ubermenu.ubermenu-main:has(#menu-item-61824.ubermenu-current-menu-item)
  #menu-item-61783
  > a.ubermenu-target
  > span::after,
.ubermenu.ubermenu-main:has(#menu-item-61824.ubermenu-current-menu-item)
  #menu-item-61783
  > a.ubermenu-target
  .ubermenu-target-title::after,
.ubermenu.ubermenu-main:has(#menu-item-61824.ubermenu-current-menu-item)
  #menu-item-61783
  > a.ubermenu-target::after {
  width: 0 !important;
  content: none !important;
  display: none !important;
}

/* Extra safety: never underline Contact links in mega */
.ubermenu.ubermenu-main a.ubermenu-target[href*="contact-us"],
.ubermenu.ubermenu-main a.ubermenu-target[href*="/contact"] {
  text-decoration: none !important;
  border-bottom: 0 !important;
}
.ubermenu.ubermenu-main a.ubermenu-target[href*="contact-us"] > span::after,
.ubermenu.ubermenu-main a.ubermenu-target[href*="/contact"] > span::after {
  content: none !important;
  display: none !important;
  width: 0 !important;
}
/* ===================== PALMER LEFT TABS UNDERLINE COLOR ===================== */
/* Your underline is coming from span::after, not text-decoration-color */

/* Default: current/ancestor underline is GREY on left tabs */
.ubermenu.ubermenu-main
  .ubermenu-tabs-group
  > li.ubermenu-tab.ubermenu-current-menu-item
  > a.ubermenu-target
  > span::after,
.ubermenu.ubermenu-main
  .ubermenu-tabs-group
  > li.ubermenu-tab.ubermenu-current-menu-ancestor
  > a.ubermenu-target
  > span::after {
  background-color: rgba(0, 0, 0, 0.40) !important;
  height: 2px; /* optional: thicker underline on left tabs */
}

/* If visible/hovered: underline becomes BLACK */
.ubermenu.ubermenu-main
  .ubermenu-tabs-group
  > li.ubermenu-tab.ubermenu-current-menu-item.palmer-tab-visible
  > a.ubermenu-target
  > span::after,
.ubermenu.ubermenu-main
  .ubermenu-tabs-group
  > li.ubermenu-tab.ubermenu-current-menu-ancestor.palmer-tab-visible
  > a.ubermenu-target
  > span::after,
.ubermenu.ubermenu-main
  .ubermenu-tabs-group
  > li.ubermenu-tab.ubermenu-current-menu-item:hover
  > a.ubermenu-target
  > span::after,
.ubermenu.ubermenu-main
  .ubermenu-tabs-group
  > li.ubermenu-tab.ubermenu-current-menu-ancestor:hover
  > a.ubermenu-target
  > span::after {
  background-color: #000 !important;
}

