/**
 * @file toolbar.module.css
 *
 *
 * Aggressive resets so we can achieve a consistent look in hostile CSS
 * environments.
*/

#toolbar-administration,
#toolbar-administration * {
  box-sizing: border-box;
  font-family: 'Ubuntu', sans-serif;
}

#toolbar-administration {
  line-height: 1;
  margin: 0;
  padding: 0;
  vertical-align: baseline;
}

@media print {
  #toolbar-administration {
    display: none;
  }
}

/**
 * Very specific overrides for Drupal system CSS.
 */
.toolbar li,
.toolbar .item-list,
.toolbar .item-list li,
.toolbar .menu-item,
.toolbar .menu-item--expanded {
  list-style-type: none;
  list-style-image: none;
}
.toolbar .menu-item {
  padding-top: 0;
}
.toolbar .toolbar-bar .toolbar-tab,
.toolbar .menu-item {
  display: block;
}
.toolbar .toolbar-bar .toolbar-tab.hidden {
  display: none;
}
.toolbar a {
  display: block;
  line-height: 20px;
}

/**
 * Administration menu.
 */
.toolbar .toolbar-bar,
.toolbar .toolbar-tray {
  position: relative;
  z-index: 1250;
}
.toolbar-horizontal .toolbar-tray {
  position: fixed;
  width: 100%;
  left: 0;
}
/* Position the admin toolbar absolutely when the configured standard breakpoint
 * is active. The toolbar container, that contains the bar and the trays, is
 * position absolutely so that it scrolls with the page. Otherwise, on smaller
 * screens, the components of the admin toolbar are positioned statically. */
.toolbar-oriented .toolbar-bar {
  left: 0;
  position: fixed;
  right: 0;
  top: 0;
}

/* body with toolbar tray open */

body.toolbar-vertical::before {
  content: '';
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0);
  -webkit-transition: background 0.25s;
  -moz-transition: background 0.25s;
  -o-transition: background 0.25s;
  transition: background 0.25s;
  z-index: 12;
  pointer-events: none;
}

body.toolbar-fixed.toolbar-tray-open::before {
  display: none;
}

body.toolbar-vertical.toolbar-tray-open::before {
  position: fixed;
  background: rgba(0, 0, 0, 0.2);
  -webkit-transition: background 0.25s;
  -moz-transition: background 0.25s;
  -o-transition: background 0.25s;
  transition: background 0.25s;
  pointer-events: auto;
}

body.toolbar-tray-open.toolbar-fixed.toolbar-vertical {
  overflow-x: hidden;
  overflow-y: auto;
}

body.toolbar-tray-open.toolbar-vertical {
  overflow: hidden;
}

/* .toolbar-loading is required by Toolbar JavaScript to pre-render markup
 * style to avoid extra reflow & flicker. */
@media (min-width: 61em) {
  .toolbar-loading.toolbar-horizontal .toolbar .toolbar-bar .toolbar-tab:last-child .toolbar-tray {
    position: relative;
    display: block;
    z-index: -999;
    visibility: hidden;
    width: 1px;
  }
  .toolbar-loading.toolbar-horizontal .toolbar .toolbar-bar .toolbar-tab:last-child .toolbar-tray .toolbar-lining {
    width: 999em;
  }
  .toolbar-loading.toolbar-horizontal .toolbar .toolbar-bar .home-toolbar-tab + .toolbar-tab .toolbar-tray {
    display: block;
  }
}

/* Layer the bar just above the trays and above contextual link triggers. */
.toolbar-oriented .toolbar-bar {
  z-index: 502;
}
/* Position the admin toolbar fixed when the configured standard breakpoint is
 * active. */
body.toolbar-fixed .toolbar-oriented .toolbar-bar {
  position: fixed;
}

/* Present the admin toolbar tabs horizontally as a default on user agents that
 * do not understand media queries or on user agents where JavaScript is
 * disabled. */
.toolbar-loading.toolbar-horizontal .toolbar .toolbar-tray .toolbar-menu > li,
.toolbar .toolbar-bar .toolbar-tab,
.toolbar .toolbar-tray-horizontal li {
  float: left; /* LTR */
}
[dir="rtl"] .toolbar-loading.toolbar-horizontal .toolbar .toolbar-tray .toolbar-menu > li,
[dir="rtl"] .toolbar .toolbar-bar .toolbar-tab,
[dir="rtl"] .toolbar .toolbar-tray-horizontal li {
  float: right;
}
/* Present the admin toolbar tabs vertically by default on user agents that
 * that understand media queries. This will be the small screen default. */
@media only screen {
  .toolbar .toolbar-bar .toolbar-tab,
  .toolbar .toolbar-tray-horizontal li {
    float: none; /* LTR */
  }
  [dir="rtl"] .toolbar .toolbar-bar .toolbar-tab,
  [dir="rtl"] .toolbar .toolbar-tray-horizontal li {
    float: none;
  }
}
/* This min-width media query is meant to provide basic horizontal layout to
 * the main menu tabs when JavaScript is disabled on user agents that understand
 * media queries. */
@media (min-width: 16.5em) {
  .toolbar .toolbar-bar .toolbar-tab,
  .toolbar .toolbar-tray-horizontal li {
    float: left; /* LTR */
  }
  [dir="rtl"] .toolbar .toolbar-bar .toolbar-tab,
  [dir="rtl"] .toolbar .toolbar-tray-horizontal li {
    float: right;
  }
}
/* Present the admin toolbar tabs horizontally when the configured narrow
 * breakpoint is active. */
.toolbar-oriented .toolbar-bar .toolbar-tab,
.toolbar-oriented .toolbar-tray-horizontal li {
  float: left; /* LTR */
}
[dir="rtl"] .toolbar-oriented .toolbar-bar .toolbar-tab,
[dir="rtl"] .toolbar-oriented .toolbar-tray-horizontal li {
  float: right;
}

/**
 * Toolbar tray.
 */
.toolbar .toolbar-tray {
  z-index: 501;
}

.toolbar-oriented .toolbar-tray-vertical {
  left: -100%; /* LTR */
  position: absolute;
  width: 320px;
}
[dir="rtl"] .toolbar-oriented .toolbar-tray-vertical {
  left: auto;
  right: -100%;
}
.toolbar .toolbar-tray-vertical > .toolbar-lining {
  margin-bottom: 60px;
}

/* Layer the links just above the toolbar-tray. */
.toolbar .toolbar-bar .toolbar-tab > .toolbar-icon {
  position: relative;
  z-index: 502;
}
/* Hide secondary menus when the tray is horizontal. */
.toolbar-oriented .toolbar-tray-horizontal .menu-item ul {
  display: none;
}
/* When the configured standard breakpoint is active and the tray is in a
 * vertical position, the tray does not scroll with the page. The contents of
 * the tray scroll within the confines of the viewport.
 */

.toolbar-vertical .toolbar.toolbar-oriented .toolbar-tray,
.toolbar .toolbar-tray-vertical.is-active,
body.toolbar-fixed .toolbar .toolbar-tray-vertical {
  height: 100%;
  min-height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
  position: fixed;
  min-width: 240px;
  width: 80%;
  max-width: 320px;
}

.toolbar-fixed .toolbar .toolbar-tray {
  display: none;
}

.toolbar .toolbar-tray.is-active {
  display: block;
}

.toolbar-fixed.toolbar-vertical .toolbar.toolbar-oriented .toolbar-tray {
  transition: none;
}

.toolbar-vertical .toolbar.toolbar-oriented .toolbar-tray {
  transition: all 0.5s ease;
}

/* Bring the tray into the viewport. By default it is just off-screen. */
.toolbar-oriented .toolbar-tray-vertical.is-active {
  left: 0; /* LTR */
}
[dir="rtl"] .toolbar-oriented .toolbar-tray-vertical.is-active {
  left: auto;
  right: 0;
}
/* When the configured standard breakpoint is active, the tray appears to push
 * the page content away from the edge of the viewport. */
body.toolbar-tray-open.toolbar-vertical.toolbar-fixed {
  margin-left: 320px; /* LTR */
}

@media print {
  body.toolbar-tray-open.toolbar-vertical.toolbar-fixed {
    margin-left: 0;
  }
}
[dir="rtl"] body.toolbar-tray-open.toolbar-vertical.toolbar-fixed {
  margin-left: auto;
  margin-right: 320px;
}

@media print {
  [dir="rtl"] body.toolbar-tray-open.toolbar-vertical.toolbar-fixed {
    margin-right: 0;
  }
}
/**
 * ToolBar tray orientation toggle.
 */
/* Hide the orientation toggle when the configured narrow breakpoint is not
 * active. */
.toolbar .toolbar-tray .toolbar-toggle-orientation {
  display: none;
}
/* Show the orientation toggle when the configured narrow breakpoint is
 * active. */
.toolbar-oriented .toolbar-tray .toolbar-toggle-orientation {
  display: block;
}
.toolbar-oriented .toolbar-tray-horizontal .toolbar-toggle-orientation {
  bottom: 0;
  position: absolute;
  right: 0; /* LTR */
  top: auto;
}
[dir="rtl"] .toolbar-oriented .toolbar-tray-horizontal .toolbar-toggle-orientation {
  left: 0;
  right: auto;
}
.toolbar-oriented .toolbar-tray-vertical .toolbar-toggle-orientation {
  float: right; /* LTR */
}
[dir="rtl"] .toolbar-oriented .toolbar-tray-vertical .toolbar-toggle-orientation {
  float: left;
}

/**
 * Toolbar home button toggle.
 */
.toolbar .toolbar-bar .home-toolbar-tab {
  float: right;
}
.path-admin .toolbar-bar .home-toolbar-tab {
  display: block;
}