/*
    ____                      _ _
   | __ ) _ __ __ _ _ __   __| (_)_ __   __ _
   |  _ \| '__/ _` | '_ \ / _` | | '_ \ / _` |
   | |_) | | | (_| | | | | (_| | | | | | (_| |
   |____/|_|  \__,_|_| |_|\__,_|_|_| |_|\__, |
                                        |___/
*/
/*

   __     ___    ____  ____
   \ \   / / \  |  _ \/ ___|
    \ \ / / _ \ | |_) \___ \
     \ V / ___ \|  _ < ___) |
      \_/_/   \_\_| \_\____/

*/
@import url("https://fonts.googleapis.com/css?family=Roboto:300,300i,400,400i,500,500i|Montserrat:300,300i,400,400i,500,500i|");
:root {
  --text-blue:  #225C88;
  --text-light: #7D8296;
  --text-white: #FFFFFF;
  --text-black: #000000; }

:root {
  --font-family: ProximaNovaA-Regular;
  --font-weight: normal;
  --font-medium-font-weight: normal;
  --font-regular-font-weight: normal;
  --font-semibold-font-weight: normal;
  --font-italic-font-weight: normal;
  --font-thin-font-weight: normal;
  --font-italic-font-style: normal; }

/*
NOTE: when you reference one of these vars, comment underneath the element you've used it for. Mandem organised
*/
/*
USED FOR:
plan inputs
dashboard-panel
dashboard panel buttons
modal-body.report-options-modal > span.glyphicon
*/
/*
USED FOR:
dashboard panel header
dashboard panel buttons
typeahead
editable table > page header
*/
/*
USED FOR:
.modal-body.report-options-modal > .Select-menu-outer
*/
/*
USED FOR:
menu
dashboard panel
charts > drillup
.dashboard-filter-sentence-container > #fixed-version
superbutton overlay content
*/
/*
context menu
USED FOR:
header
pinned nav
dashboard panel
simple sidebar
spark chart

*/
/*
USED FOR:
modals
tooltip box
c tooltip

*/
/*
USED FOR:
error messages

*/
.manage-groups-page {
  margin: 2rem;
  font-size: var(--text-size-small);
  margin-left: calc(300px + 2rem);
  max-height: calc(100% - 3rem);
  max-width: 850px;
  overflow-y: scroll;
  background: white;
  border-radius: 3px;
  padding: 2rem; }
  .manage-groups-page .z-index {
    z-index: 10; }
  .manage-groups-page section > p {
    font-size: var(--text-size-medium); }
  @media screen and (min-width: 1650px) {
    .manage-groups-page {
      max-width: 100%; }
      .manage-groups-page .widescreen-column {
        float: left;
        width: 50%;
        padding-left: 2rem;
        padding-right: 2rem; }
      .manage-groups-page .widescreen-column:nth-of-type(1) {
        border-right: 1px solid #E0E4E7;
        margin-right: -1px; }
      .manage-groups-page .widescreen-column:nth-of-type(2) {
        border-left: 1px solid #E0E4E7; } }
  .manage-groups-page .fa-clipboard-list {
    color: #e9514f; }
  .manage-groups-page .fa-users {
    color: #79b829; }
  .manage-groups-page .fa-object-ungroup {
    color: #4283d1; }
  .manage-groups-page .float-left.btn + .float-left.btn {
    margin-left: 1rem; }
  .manage-groups-page .float-right.btn + .float-right.btn {
    margin-right: 1rem; }
  .manage-groups-page .user-list {
    position: relative;
    list-style: none;
    padding: 0; }
    .manage-groups-page .user-list .group-list a::after {
      display: inline-block;
      margin-right: 0.5rem;
      content: ", ";
      color: black;
      text-decoration: none; }
      .manage-groups-page .user-list .group-list a::after:hover {
        text-decoration: none; }
    .manage-groups-page .user-list .group-list a:nth-last-of-type(2)::after {
      margin-left: 0.5rem;
      margin-right: 0.5rem;
      content: " and "; }
    .manage-groups-page .user-list .group-list a:nth-last-of-type(1)::after {
      content: ""; }
  .manage-groups-page .group-list {
    list-style: none;
    padding: 0; }
  .manage-groups-page .manage-group {
    transform: translate3d(0, 0, 0); }

.manage-group-details .page-header .group-name-form .group-name-input,
.manage-user-groups .page-header .group-name-form .group-name-input {
  border: 0;
  vertical-align: middle;
  line-height: 18px;
  font-size: 18px;
  padding: 6px 0; }

.manage-group-details .page-header .group-name-form .group-name-input:focus,
.manage-group-details .page-header .group-name-form .group-name-input:active,
.manage-user-groups .page-header .group-name-form .group-name-input:focus,
.manage-user-groups .page-header .group-name-form .group-name-input:active {
  outline: 0;
  box-shadow: none !important; }

.manage-group-details .reports-snapshots-header,
.manage-user-groups .reports-snapshots-header {
  margin: 0; }

.manage-group-details .reports-snapshots-header > .section,
.manage-user-groups .reports-snapshots-header > .section {
  min-width: 160px;
  margin: 0;
  padding: 0;
  border-right: 1px solid #E0E4E7; }

.manage-group-details .reports-snapshots-header > .section > h5,
.manage-user-groups .reports-snapshots-header > .section > h5 {
  display: block;
  height: 50px;
  line-height: 50px;
  text-align: center;
  color: #242A32;
  font-size: 16px;
  margin: 0;
  padding: 0 4rem; }

.manage-group-details .members-container,
.manage-group-details .reports-snapshots-header > .section > a:first-child,
.manage-user-groups .members-container,
.manage-user-groups .reports-snapshots-header > .section > a:first-child {
  border-right: 1px solid #E0E4E7; }

.manage-group-details .search-header,
.manage-user-groups .search-header {
  width: 100%;
  padding: 20px 0; }

.manage-group-details .search-header > input,
.manage-user-groups .search-header > input {
  max-width: 220px; }

.manage-group-details .members > li.member,
.manage-user-groups .members > li.member {
  padding: 5px 15px 5px 0; }

.manage-group-details .members > .member > .member-thumbnail,
.manage-user-groups .members > .member > .member-thumbnail {
  display: inline-block;
  text-align: center;
  width: 35px;
  height: 35px;
  line-height: 38px;
  border-radius: 25px;
  background-color: #4283d1;
  color: #ffffff;
  cursor: pointer;
  margin: 0 10px 0 0;
  text-decoration: none !important; }

.manage-group-details .members > .member > .member-remove > i,
.manage-user-groups .members > .member > .member-remove > i {
  line-height: 36px;
  cursor: pointer;
  color: #ED6447; }

.manage-group-details .members > .member > .member-add > i,
.manage-user-groups .members > .member > .member-add > i {
  line-height: 36px;
  cursor: pointer;
  color: #42B04B; }

.manage-group-details .groups > .group,
.manage-user-groups .groups > .group {
  padding: 5px 0; }

.manage-group-details .groups > .group .btn,
.manage-user-groups .groups > .group .btn {
  color: #ffffff; }

.manage-group-details .groups > .group > .btn-group .subgroup-remove,
.manage-user-groups .groups > .group > .btn-group .subgroup-remove {
  margin-right: 0;
  color: #ED6447; }

.manage-group-details .groups > .group > .btn-group .subgroup-add,
.manage-user-groups .groups > .group > .btn-group .subgroup-add {
  margin-right: 0;
  color: #42B04B; }

.manage-group-details .sub-groups-container,
.manage-user-groups .sub-groups-container {
  margin-bottom: 20px; }

.manage-group-details .groups.parent-groups > .group .btn,
.manage-user-groups .groups.parent-groups > .group .btn {
  color: #7D8296; }

.manage-groups {
  height: calc(100vh - 50px);
  overflow: hidden; }

.groups-list {
  height: 100%;
  overflow-y: scroll !important;
  width: 300px;
  margin-right: 2rem;
  background: #EAEAEA; }

.pool-actions button {
  display: block; }

.groups-list .react-large-tree {
  color: black !important;
  background: #EAEAEA !important;
  max-width: 300px !important; }
  .groups-list .react-large-tree .expanded.top-level {
    box-shadow: none !important; }
  .groups-list .react-large-tree .node {
    height: 2em !important;
    line-height: 2em !important;
    background: #d1d0d0 !important;
    padding: 0; }
    .groups-list .react-large-tree .node button.expand-button {
      height: inherit; }
    .groups-list .react-large-tree .node a {
      color: black !important;
      text-decoration: none !important;
      display: inline-block; }
      .groups-list .react-large-tree .node a:hover span {
        text-decoration: underline !important; }
    .groups-list .react-large-tree .node.top-level {
      background: #EAEAEA !important;
      border-bottom: 1px solid #f7f7f7; }
    .groups-list .react-large-tree .node input {
      height: 2em !important;
      line-height: 2em !important; }
      .groups-list .react-large-tree .node input::selection {
        color: #EAEAEA !important;
        background: yellow !important; }
    .groups-list .react-large-tree .node.drop-into {
      background: white !important; }
    .groups-list .react-large-tree .node.drop-before {
      box-shadow: inset 0 4px 0 black !important; }
    .groups-list .react-large-tree .node.drop-after {
      box-shadow: inset 0 -4px 0 black !important; }
    .groups-list .react-large-tree .node:hover {
      background: white !important;
      color: black !important; }
    .groups-list .react-large-tree .node.highlight {
      /* Folder/dashboard/item that you're currently in */ }
      .groups-list .react-large-tree .node.highlight i.__user-icon {
        opacity: 1 !important;
        color: #4C8EE3; }
  .groups-list .react-large-tree li.input-node {
    padding-left: 22px;
    border-top: 2px dashed #F2F4F5 !important;
    border-bottom: 2px dashed #F2F4F5 !important; }
  .groups-list .react-large-tree.dragging-true .node {
    /*background: purple !important;*/ }
    .groups-list .react-large-tree.dragging-true .node:hover {
      background: yellow !important;
      box-shadow: inset 0 0 4px black !important; }
  .groups-list .react-large-tree .context-menu {
    background: black !important;
    color: #EAEAEA !important;
    border-left: #EAEAEA 4px solid !important; }
  .groups-list .react-large-tree .expand-button {
    color: black !important; }
  .groups-list .react-large-tree .context-button {
    height: 2em !important; }
    .groups-list .react-large-tree .context-button:hover {
      background: salmon !important; }
      .groups-list .react-large-tree .context-button:hover circle {
        fill: #EAEAEA !important; }
  .groups-list .react-large-tree .context-button circle {
    fill: black !important; }
  .groups-list .react-large-tree .context-active {
    background: white !important; }
  .groups-list .react-large-tree .context-active .context-button {
    background: salmon !important; }
    .groups-list .react-large-tree .context-active .context-button circle {
      fill: #EAEAEA !important; }
    .groups-list .react-large-tree .context-active .context-button:hover {
      background: black !important; }
      .groups-list .react-large-tree .context-active .context-button:hover circle {
        fill: black !important; }
  .groups-list .react-large-tree .search-result-highlight {
    box-shadow: 0 2px 0 0 #EAEAEA, 0 3px 0 0 yellow !important; }
  .groups-list .react-large-tree.drag-allowed-false .node.drop-into {
    background: #cdcccc !important; }
  .groups-list .react-large-tree.drag-allowed-false .node.drop-before {
    box-shadow: inset 0 4px 0 grey !important; }
  .groups-list .react-large-tree.drag-allowed-false .node.drop-after {
    box-shadow: inset 0 -4px 0 grey !important; }

.groups-list input.tree-searcher {
  border: none;
  border: 1px solid white;
  height: 2em;
  padding: 0.5rem;
  margin: 0;
  display: block;
  width: 100%; }

.new-group-form {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  margin-bottom: 2rem; }
  .new-group-form h2 {
    flex: 1 1 100%; }
  .new-group-form label {
    flex: 0 0;
    margin-right: 1rem; }
  .new-group-form input {
    flex: 3 1; }
  .new-group-form label, .new-group-form input {
    line-height: 2rem;
    padding: 0.5rem; }

.group-tree .rst__rowLabel small {
  display: block; }

.multicolumn-list {
  column-width: 250px; }

.rules-table {
  table-layout: fixed;
  width: 100%; }
  .rules-table tbody tr:nth-child(1) td {
    padding-top: 0.5rem; }
  .rules-table th {
    padding: 0.5rem 0;
    border-bottom: 1px solid var(--border-light-grey);
    text-align: left; }
  .rules-table td {
    vertical-align: top;
    padding: 0 1rem 0.5rem 0;
    word-break: break-word; }
  .rules-table tr:hover {
    background: var(--highlight-lightest); }

.user-search input {
  padding: 0.5rem;
  border-radius: 3px;
  border: 1px solid #E0E4E7; }

.groups-pool h1, .groups-pool h2, .groups-pool h3, .groups-pool h4, .groups-pool h5, .groups-pool h6, .manage-groups-page h1, .manage-groups-page h2, .manage-groups-page h3, .manage-groups-page h4, .manage-groups-page h5, .manage-groups-page h6 {
  margin: 0; }

.groups-pool {
  z-index: 10;
  position: fixed;
  bottom: 0px;
  right: 6rem;
  left: 2rem;
  transition: transform 0.2s ease-out; }
  .groups-pool header {
    float: right;
    padding: 1rem;
    background: white;
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;
    border-top: 1px solid #7D8296;
    border-left: 1px solid #7D8296;
    border-right: 1px solid #7D8296;
    border-bottom: 1px solid white;
    margin-bottom: -1px; }
  .groups-pool a {
    color: #4C8EE3; }
  .groups-pool .details {
    border-top: 1px solid #7D8296;
    border-left: 1px solid #7D8296;
    border-right: 1px solid #7D8296;
    padding: 1rem;
    background: white;
    clear: both;
    font-size: 1.2rem;
    border-top-left-radius: 5px; }
    .groups-pool .details::after {
      clear: both;
      content: " ";
      display: block;
      width: 100%; }
  .groups-pool ul {
    column-width: 250px;
    padding: 0;
    list-style: none;
    font-size: var(--text-size-small); }
    .groups-pool ul li {
      display: block; }
  .groups-pool.closed {
    pointer-events: none;
    transform: translate3d(0, calc(100% - 3rem), 0); }
    .groups-pool.closed header {
      pointer-events: auto; }
  .groups-pool hr {
    clear: both; }
