/* Portal layout overrides loaded after Perfex core assets. */

@media (min-width: 769px) {
  #header .header-desktop-shell {
    min-width: 0;
    gap: clamp(10px, 1.6vw, 22px);
  }

  #header .header-left-cluster {
    flex: 0 1 270px;
    min-width: 190px;
  }

  #header .header-center-cluster {
    flex: 1 1 auto;
    min-width: 180px;
    display: flex;
    justify-content: center;
  }

  #header #top_search {
    width: min(700px, 100%);
    max-width: min(700px, calc(100vw - 640px));
    min-width: 180px;
  }

  #header .header-right-cluster {
    flex: 0 0 auto;
    min-width: max-content;
    gap: clamp(4px, 0.8vw, 10px);
    padding-left: clamp(4px, 0.8vw, 10px);
    align-items: center;
    justify-content: flex-end;
    white-space: nowrap;
  }

  #header .header-quick-actions,
  #header .header-utility-list {
    flex: 0 0 auto;
    flex-wrap: nowrap;
    gap: clamp(2px, 0.5vw, 6px);
  }

  #header .header-settings-link,
  #header .header-icon-link,
  #header .header-notifications .dropdown-toggle,
  #header .header-quick-create,
  #header .header-quick-create span {
    flex: 0 0 auto;
  }
}

@media (max-width: 1520px) and (min-width: 769px) {
  #header .header-left-cluster {
    flex-basis: 236px;
    min-width: 180px;
  }

  #header #top_search {
    max-width: min(560px, calc(100vw - 600px));
  }

  #header .header-settings-link span {
    display: none;
  }

  #header .header-settings-link {
    width: 36px;
    padding: 0 !important;
    justify-content: center;
  }
}

@media (max-width: 1320px) and (min-width: 769px) {
  #header .header-desktop-shell {
    gap: 12px;
    padding-left: 16px;
    padding-right: 16px;
  }

  #header .header-left-cluster {
    flex-basis: 215px;
    min-width: 160px;
    gap: 10px;
  }

  #header #logo img {
    max-width: 165px;
  }

  #header #top_search {
    max-width: min(500px, calc(100vw - 560px));
  }

  #header .header-right-cluster {
    gap: 6px;
    padding-left: 8px;
  }

  #header .header-quick-actions,
  #header .header-utility-list {
    gap: 4px;
  }
}

@media (max-width: 1120px) and (min-width: 769px) {
  #header .header-left-cluster {
    flex-basis: 206px;
  }

  #header #top_search {
    max-width: min(420px, calc(100vw - 500px));
  }

  #header .header-icon-link,
  #header .header-notifications .dropdown-toggle,
  #header .header-settings-link {
    width: 34px;
  }
}

#setup-menu-wrapper #setup-menu {
  background: transparent !important;
  margin-top: 0 !important;
  padding: 12px 10px 18px !important;
}

#setup-menu-wrapper .portal-setup-heading {
  margin: 0 0 12px !important;
  padding: 10px 12px !important;
  min-height: 48px;
  border-radius: 16px;
}

#setup-menu-wrapper #setup-menu .customizer-heading {
  position: static !important;
  top: auto !important;
  right: auto !important;
  font-size: 14px !important;
  line-height: 20px !important;
  font-weight: 600 !important;
}

#setup-menu-wrapper #setup-menu>li>a,
#setup-menu-wrapper #setup-menu li a.setup-menu-link {
  display: flex !important;
  align-items: center !important;
  min-height: 38px !important;
  margin: 2px 0 !important;
  padding: 8px 12px !important;
  border-radius: 12px !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 18px !important;
  text-align: left !important;
}

#setup-menu-wrapper #setup-menu>li.active>a,
#setup-menu-wrapper #setup-menu>li>a:hover,
#setup-menu-wrapper #setup-menu>li>a:focus {
  background: #edf6f2 !important;
  color: #142132 !important;
}

#setup-menu-wrapper #setup-menu .fa.arrow {
  float: none !important;
  margin: 0 0 0 auto !important;
  padding: 0 !important;
  line-height: 1 !important;
}

#setup-menu-wrapper #setup-menu li .nav-second-level li a,
#setup-menu-wrapper #setup-menu li .nav-second-level li a.setup-menu-sublink {
  display: flex !important;
  align-items: center !important;
  min-height: 32px !important;
  margin: 1px 0 !important;
  padding: 6px 10px 6px 30px !important;
  border-radius: 10px !important;
  background: transparent !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 18px !important;
}