/* This Source Code Form is subject to the terms of the Mozilla Public
 * License, v. 2.0. If a copy of the MPL was not distributed with this
 * file, You can obtain one at http://mozilla.org/MPL/2.0/. */

html,
body {
  display: flex;
  min-width: 0; /* This allows Flexible Layout to shrink this further than its min-content */
  height: 100%;
  flex: 1;
  padding: 0;
  margin: 0;

  /* This line has been stolen from
   * https://css-tricks.com/os-specific-fonts-css/
   * Just Noto Sans and Liberation Sans have been inserted before "Cantarell"
   * (used on Linux Gnome), because it lacks a glyph for the symbol µ.
   * Please keep it synced with res/photon/style.css.
   */
  font-family:
    -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu,
    'Noto Sans', 'Liberation Sans', Cantarell, 'Helvetica Neue', sans-serif;
  font-size: 11px;

  /* equal size all numbers, so that longer numbers are larger */
  font-variant-numeric: tabular-nums;

  /* Disable the "rubberband" overscrolling effect in Chrome. This happens when
   * using the charts and the scroll wheel. */
  overscroll-behavior: none;

  /* background-color is defined in the HTML file to prevent flashing a white screen. */
}

:root {
  /* Photon animation curve */
  --animation-curve: cubic-bezier(0.07, 0.95, 0, 1);

  color: var(--grey-90);
}

@media (forced-colors: active) {
  :root {
    /* The following properties are retrieved in index.js to create SVG filters that
    * we can apply on icons to control their color.
    * These variable can be declared in any rule, as long as their value is still
    * a valid color (which means we can use `light-dark()` or any other color functions).
    * The colors can be applied on SVG icons with `filter: url(#--var-name)` */
    --button-icon-color: ButtonText;
    --button-icon-hover-color: SelectedItem;
    --button-icon-active-color: SelectedItem;
  }
}

.profileFilterNavigator {
  height: 24px;
  flex-shrink: 1;
}

.treeAndSidebarWrapper {
  display: flex;
  flex: 1;
  flex-flow: column nowrap;
}

#svg-filters {
  position: absolute;
  overflow: hidden;
  width: 0;
  height: 0;
  inset-inline-start: -1000vw;
}
