/**
 * Copyright (c) 2017-present, Facebook, Inc.
 *
 * This source code is licensed under the MIT license found in the
 * LICENSE file in the root directory of this source tree.
 */

/**
 * Any CSS included here will be global. The classic template
 * bundles Infima by default. Infima is a CSS framework designed to
 * work well for content-centric websites.
 */

/* You can override the default Infima variables here. */
:root {
  --ifm-color-primary: #25c2a0;
  --ifm-color-primary-dark: rgb(33, 175, 144);
  --ifm-color-primary-darker: rgb(31, 165, 136);
  --ifm-color-primary-darkest: rgb(26, 136, 112);
  --ifm-color-primary-light: rgb(70, 203, 174);
  --ifm-color-primary-lighter: rgb(102, 212, 189);
  --ifm-color-primary-lightest: rgb(146, 224, 208);
}

html[data-theme="light"] {
  --ifm-color-warning: #fff3cd;
  --ifm-alert-background-color: #fff3cd;
  --ifm-alert-border-color: #ffeeba;
  --ifm-alert-color: #856404;
  --ra-admonition-icon-color: #856404;
}

html[data-theme="light"] .admonition-info {
  --ifm-color-info: #d1ecf1;
  --ifm-alert-background-color: #d1ecf1;
  --ifm-alert-border-color: #bee5eb;
  --ifm-alert-color: #0c5460;
  --ra-admonition-icon-color: #0c5460;
}

.docusaurus-highlight-code-line {
  background-color: rgb(72, 77, 91);
  display: block;
  margin: 0 calc(-1 * var(--ifm-pre-padding));
  padding: 0 var(--ifm-pre-padding);
}

.hero.hero--primary {
  background-color: #159957;
  background-image: linear-gradient(120deg, #155799, #159957);
}

.hero.hero--primary .button.button--secondary.button--outline {
  color: #f5f6f7;
}

.hero.hero--primary .hero__title {
  color: #f5f6f7;
}

.hero.hero--primary .hero__subtitle {
  color: #f5f6f7;
  font-size: 2.4rem;
  text-align: left;
  max-width: 500px;
  margin: 30px 0;
}

.hero.hero--primary .button.button--outline:hover,
.hero.hero--primary .button.button--outline:active,
.hero.hero--primary .button.button--outline.button--active {
  background-color: rgba(70, 203, 174, 0.5);
}

.navbar .navbar__logo {
  max-height: 100%;
}

.navbar .icon[href*=github],
.navbar .icon[href*=twitter],
.navbar .icon[href*=slack] {
  font-size: 0;
  padding: 4px;
  margin: 0 4px;
}

.navbar .icon[href*=github]::before,
.navbar .icon[href*=twitter]::before,
.navbar .icon[href*=slack]::before {
  content: '';
  display: block;
  width: 32px;
  height: 32px;
  background-size: cover;
}

.navbar .icon[href*=github]::before {
  background-image: url('/static/img/github-brand.svg');
}

.navbar .icon[href*=slack]::before {
  background-image: url('/static/img/slack-brand.svg');
}

.navbar .icon[href*=twitter]::before {
  background-image: url('/static/img/twitter-brand.svg');
}

.navbar a[data-type="versions"] {
  white-space: nowrap;
  text-decoration: underline;
  position: relative;
  font-size: 0.8em;
}

.navbar .react-toggle {
  margin: 0 0 0 8px;
}

.button {
  border-radius: 100px;
  margin: 0 10px;
}

.github-button {
  margin: 4px 0 0 20px;
  position: relative;
  top: 5px;
}

a[href*=edit] {
  border: 1px solid #ccc;
  border-radius: 100px;
  padding: 8px 16px;
  display: block;
  margin: 0 auto;
  width: 200px;
  text-align: center;
}

.margin-vert--xl {
  margin-bottom: 3rem !important;
  margin-top: 3rem !important;
}

.pagination-nav .pagination-nav__item a {
  border-radius: 100px 20px 20px 100px;
  padding-left: 40px;
}

.pagination-nav .pagination-nav__item--next a {
  border-radius: 20px 100px 100px 20px;
  padding-right: 40px;
}

html[data-theme="dark"] .navbar .navbar__brand,
html[data-theme="dark"] .main-wrapper a[class*='sidebarLogo'] {
  background-image: url('/static/img/logo-dark.svg');
  background-repeat: no-repeat;
  background-position: left center;
  background-size: contain;
}

html[data-theme="dark"] .navbar .navbar__brand img,
html[data-theme="dark"] .main-wrapper a[class*='sidebarLogo'] img {
  visibility: hidden;
}

html[data-theme="dark"] .main-wrapper a[class*='sidebarLogo'] {
  margin-right: 70px;
}

html[data-theme="dark"] .hero.hero--primary {
  background-color: #0d572f;
  background-image: linear-gradient(120deg, #0c335a, #0c5430);
}

html[data-theme="dark"] .navbar .navbar__link[href*=github]:before {
  background-image: url('/static/img/github-brand-dark.svg');
}

html[data-theme="dark"] .navbar .navbar__link[href*=slack]:before {
  background-image: url('/static/img/slack-brand-dark.svg');
}

html[data-theme="dark"] .navbar .navbar__link[href*=twitter]:before {
  background-image: url('/static/img/twitter-brand-dark.svg');
}

@media screen and (max-width: 1024px) {
  .hero.hero--primary .hero__subtitle {
    font-size: 2rem;
  }

  .hero.hero--primary .container img {
    height: 260px;
  }
}

@media screen and (max-width: 700px) {
  .hero.hero--primary .hero__subtitle {
    font-size: 2rem;
    text-align: center;
    max-width: inherit;
  }

  .buttons_src-pages- {
    max-width: inherit !important;
  }

  .hero.hero--primary .container img {
    display: none;
  }
}

@media screen and (max-width: 500px) {
  .hero.hero--primary .hero__subtitle {
    font-size: 1.4rem;
  }

  .buttons_src-pages- {
    margin: 0 -30px;
  }
}

@media screen and (min-width: 995px) and (max-width: 1130px) {
  .navbar .icon[href*=twitter],
  .navbar .icon[href*=slack] {
    display: none;
  }
}

@media screen and (min-width: 995px) and (max-width: 1030px) {
  .navbar a[data-type="versions"] {
    display: none;
  }
}

@media screen and (max-width: 375px) {
  .hero.hero--primary .button.button--outline {
    font-size: 0.8rem;
  }
}

html code {
  color: #1c1e21;
  background-color: #ebedf0;
}

html[data-theme="dark"] code {
  color: #f5f6f7;
  background-color: #444950;
}

html a code {
  color: inherit
}

.navbar svg[class*=iconExternalLink],
aside svg[class*=iconExternalLink] {
  display: none;
}

.apiItemContainer .tsd-readme h1:first-child {
  display: none;
}