/**
 * Styles and variables for the administration filters component.
 */
/**
 * Filters used to narrow down content on an administration datagrid.
 *
 * These are shown as a list of filters on the side of the page.
 *
 * Structure:
 *     <div class="rb-c-admin-filters">
 *      <header class="rb-c-admin-filters__title">...</header>
 *      <div class="rb-c-admin-filter">...</div>
 *      ...
 *     </div>
 */
.rb-c-admin-filters {
  position: absolute;
  top: 4em;
  /* Align with the datagrid. */
  right: 0;
  bottom: 0;
  width: 240px;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  /**
   * The title for the filters pane.
   *
   * Structure:
   *     <header class="rb-c-admin-filters__title">...</header>
   */
}
@media only screen and (max-width: 800px) {
  .rb-c-admin-filters {
    display: none;
  }
}
.rb-c-admin-filters__title {
  font-size: 110%;
  font-weight: bold;
  color: #444;
  padding: 0 0 0 15px;
  margin: 1em 0;
  text-transform: uppercase;
}
/**
 * A filter containing a name and available choices.
 *
 * Structure:
 *     <div class="rb-c-admin-filter">
 *      <h3 class="rb-c-admin-filter__name">...</h3>
 *      <ul class="rb-c-admin-filter__choices">...</ul>
 *     </div>
 */
.rb-c-admin-filter {
  margin: 2em 0 3em 0;
  /**
   * A list of choices available for the filter.
   *
   * Structure:
   *     <ul class="rb-c-admin-filter__choices">
   *      <li class="rb-c-admin-filter__choice -is-selected">...</li>
   *      <li class="rb-c-admin-filter__choice">...</li>
   *      ...
   *     </ul>
   */
  /**
   * A choice available for the filter.
   *
   * Modifiers:
   *     -is-selected:
   *         The filter is currently selected and active. Only one choice
   *         in a filter should have this modifier applied at once.
   *
   * Structure:
   *     <li class="rb-c-admin-filter__choice">
   *      <a href="...">...</a>
   *     </li>
   */
  /**
   * The name of the filter.
   *
   * Structure:
   *     <h3 class="rb-c-admin-filter__name">...</h3>
   */
}
.rb-c-admin-filter__choices {
  line-height: 150%;
  list-style: none;
  margin: 0;
  padding: 0 0 0 15px;
}
.rb-c-admin-filter__choice {
  margin: 0;
  padding: 0 0 0 10px;
  border-left: 5px transparent solid;
  margin-left: -15px;
}
.rb-c-admin-filter__choice.-is-selected {
  border-left-color: #DDD;
  padding-left: 10px;
}
.rb-c-admin-filter__choice.-is-selected a:link,
.rb-c-admin-filter__choice.-is-selected a:visited {
  color: #124BBD;
}
.rb-c-admin-filter__choice a:link,
.rb-c-admin-filter__choice a:visited {
  display: block;
  color: #999;
}
.rb-c-admin-filter__name {
  font-size: 110%;
  font-weight: normal;
  margin: 0 0 1em 0;
  padding: 0 0 0 15px;
}
/*# sourceMappingURL=filters.css.map */