/* 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/. */

@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");

scrollcorner,
resizer,
scrollbar {
  /* Rules required for style caching of anonymous content scrollbar parts */
  /* stylelint-disable-next-line media-query-no-invalid */
  @media -moz-pref("layout.css.cached-scrollbar-styles.enabled") {
    /* All scrollbar parts must not inherit any properties from the scrollable
     * element (except for visibility and pointer-events), for the anonymous
     * content style caching system to work.
     */
    all: initial;
    visibility: inherit;
    pointer-events: inherit;

    /* These properties are not included in 'all'. */
    -moz-context-properties: initial;
    -moz-control-character-visibility: initial;
    -moz-min-font-size-ratio: initial;
    -moz-box-collapse: initial;
    -moz-theme: initial;

    /* We don't want zoom on our ancestors to affect our styles. */
    zoom: document;

    math-depth: initial;
    /* As long as inert implies pointer-events: none as it does now, we're
     * good. */
    -moz-inert: initial;

    /* direction: initial is not sufficient, since its initial value can depend
     * on the document's language. But we specify ltr explicitly below */

    /* Similarly for font properties, whose initial values depend on the
     * document's language.  Scrollbar parts don't have any text or rely on
     * font metrics.
     */
    font: 16px sans-serif;

    /* The initial value of justify-items is `legacy`, which makes it depend on
     * the parent style.
     *
     * Reset it to something else.
     */
    justify-items: start;
  }

  /* We need a display value that doesn't get blockified to preserve the
   * scrollbar sizing asserts. In practice it doesn't matter since these get
   * special frames */
  display: block;
  box-sizing: border-box;

  /* Our scrollbar layout uses physical coordinates, we wouldn't want an
   * horizontal scrollbar to flip in rtl for example. */
  direction: ltr;
  writing-mode: initial;

  -moz-user-focus: ignore;
  user-select: none;
}

/********** resizer **********/

resizer {
  position: relative;
  z-index: 2147483647;

  background: url("chrome://global/skin/icons/resizer.svg") no-repeat;
  background-size: 100% 100%;
  cursor: se-resize;
  width: 15px;
  height: 15px;

  @media (-moz-platform: android) {
    pointer-events: none;
  }

  &[dir="left"],
  &[dir="bottom"][flip],
  &[dir="bottomleft"] {
    transform: scaleX(-1);
  }

  &[dir="bottomleft"] {
    cursor: sw-resize;
  }

  &[dir="top"],
  &[dir="bottom"] {
    cursor: ns-resize;
  }

  &[dir="left"],
  &[dir="right"] {
    cursor: ew-resize;
  }

  &[dir="topleft"] {
    cursor: nw-resize;
  }

  &[dir="topright"] {
    cursor: ne-resize;
  }
}

thumb {
  appearance: auto;
  -moz-default-appearance: scrollbarthumb-horizontal;

  scrollbar[vertical] & {
    -moz-default-appearance: scrollbarthumb-vertical;
  }

  scrollbar:disabled & {
    visibility: hidden;
  }
}

scrollbar {
  appearance: auto;
  -moz-default-appearance: scrollbar-horizontal;
  cursor: default;

  /* stylelint-disable-next-line media-query-no-invalid */
  @media -moz-pref("layout.testing.scrollbars.always-hidden") {
    opacity: 0 !important;
  }

  @media (-moz-platform: android) {
    pointer-events: none;
  }

  @media (-moz-overlay-scrollbars) {
    will-change: opacity;
    transition-property: opacity;
    transition-duration: env(-moz-overlay-scrollbar-fade-duration);

    &:not([active]),
    &:disabled {
      pointer-events: none;
      opacity: 0;
    }
  }

  &[vertical] {
    -moz-default-appearance: scrollbar-vertical;
  }

  &[root] {
    position: relative;
    z-index: 2147483647; /* largest positive value of a signed 32-bit integer */
  }
}

scrollbarbutton {
  appearance: auto;
  -moz-default-appearance: scrollbarbutton-right;

  scrollbar[vertical] > & {
    -moz-default-appearance: scrollbarbutton-down;
  }

  &[type="decrement"] {
    -moz-default-appearance: scrollbarbutton-left;

    scrollbar[vertical] > & {
      -moz-default-appearance: scrollbarbutton-up;
    }
  }
}

scrollcorner {
  appearance: auto;
  -moz-default-appearance: scrollcorner;
  width: 16px;
  cursor: default;

  @media (-moz-overlay-scrollbars) {
    pointer-events: none;
  }
}