/*******************************
         Theme Overrides
*******************************/

.ui.basic.segment.header-wrapper {
  margin-bottom: 0;
}

.ui.basic.segment .header {
  display: flex;
  align-items: center;
  justify-content: space-between;

  .logo-nav-wrapper {
    display: flex;
    flex: 1;
    align-items: center;

    .logo {
      flex: 0 0 auto;
    }

    .navigation {
      -ms-overflow-style: none; // IE 10+
      overflow-x: auto;

      &::-webkit-scrollbar {
        height: 0; /* remove scrollbar space */
        background: transparent; /* optional: just make scrollbar invisible */
      }

      /* optional: show position indicator in red */
      &::-webkit-scrollbar-thumb {
        background: #f00;
      }

      @media only screen and (max-width: @tabletBreakpoint) {
        overflow-x: initial;
      }
    }
  }

  @media only screen and (max-width: @tabletBreakpoint) {
    flex-direction: column;
    align-items: initial;

    .logo-nav-wrapper {
      align-items: initial;
      justify-content: space-between;
    }
  }
}

.ui.basic.segment.content-area {
  flex: 1 0 auto; // IE11 fix, can't barely use  flex: 1;
  padding-right: 0;
  padding-left: 0;
}

.ui.primary.segment {
  border-bottom: @4px solid @greyBorderColor;
  font-size: @16px;
  font-weight: @headerFontWeight;
}

.ui.secondary.segment {
  font-size: @12px;
}

.ui.discreet.segment {
  color: @lightGrey;
  font-size: @12px;
}

.ui.form.segment {
  padding: 0;

  .ui.grid > .row {
    padding-top: 0;
    padding-bottom: 0;
  }
}

.ui.actions.segment {
  border-top: @1px solid @lightGreyBorderColor;
}

.inverted.segment a.item {
  color: @white;
  text-decoration: underline;
}

.pusher > .ui.basic.segment {
  padding-bottom: 0;
}

.ui.secondary.attached.segment {
  text-transform: uppercase;
}

.ui.segment.dashed {
  border: 3px dashed #ccc;
  box-shadow: none;
}

.users-control-panel .ui.clearing.segment.actions {
  text-transform: uppercase;
}