/* Header.jsx */

.headerRoot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}

/* HEADER LEFT */

.headerLeft {
  display: flex;
  align-items: center;
  flex: 0 0 auto;
  width: 25%;
}

.headerLeftSeparator {
  width: 1px;
  height: 40px;
  background-color: #c9ccd4;
  margin-left: 30px;
}

.headerCategoryContainer {
  display: flex;
  align-items: center;
  margin-left: 30px;
  color: #0e1133;
}

.headerCategoryContainer:hover {
  color: #2b4eff;
}

.categoryPlaceholder {
  font-size: 16px;
  font-weight: 500;
  padding-left: 14px;
  padding-top: 3px;
}

.categoryIcon {
  display: inline-block;
  width: 16px;
  height: 16px;
}

.categoryPlaceholder > .ui.simple.dropdown > .menu.transition {
  padding: 17px 0px;
  left: -30px;
}

.categoryPlaceholder > .ui.simple.dropdown > .menu.transition > .item {
  box-shadow: none !important;
}

.categoryPlaceholder
  > .ui.simple.dropdown
  > .menu.transition
  > .item[role='option'] {
  width: 200px;
  color: #6d6e75 !important;
  background: #fff !important;
  border: none;
  padding: 3px 30px !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  text-transform: capitalize;
  line-height: 26px;
}

.categoryPlaceholder
  > .ui.simple.dropdown
  > .menu.transition
  > .item[role='option']:hover {
  color: #2b4eff !important;
  background: none !important;
}

/* HEADER RIGHT */

.headerRight {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  flex: 0 0 auto;
  width: 75%;
}

.headerSearch {
  margin-left: 50px;
}

.headerButton {
  margin-left: 20px;
  display: flex;
}

// Hiding breadcrumbs from the App first level component
.siteroot .ui.secondary.segment.breadcrumbs,
.section-edit .ui.secondary.segment.breadcrumbs {
  display: none;
}

// Hiding Page Heading
.ui.container > .documentFirstHeading,
.ui.container > .documentDescription {
  display: none;
}