/*-----------------------------------------------------------------------------
| Copyright (c) Jupyter Development Team.
| Distributed under the terms of the Modified BSD License.
|----------------------------------------------------------------------------*/
/*
 * The following CSS variables define the main, public API for styling JupyterLab.
 * These variables should be used by all plugins wherever possible. In other
 * words, plugins should not define custom colors, sizes, etc unless absolutely
 * necessary. This enables users to change the visual theme of JupyterLab
 * by changing these variables.
 *
 * Many variables appear in an ordered sequence (0,1,2,3). These sequences
 * are designed to work well together, so for example, `--jp-border-color1` should
 * be used with `--jp-layout-color1`. The numbers have the following meanings:
 *
 * 0: super-primary, reserved for special emphasis
 * 1: primary, most important under normal situations
 * 2: secondary, next most important under normal situations
 * 3: tertiary, next most important under normal situations
 *
 * Throughout JupyterLab, we are mostly following principles from Google's
 * Material Design when selecting colors. We are not, however, following
 * all of MD as it is not optimized for dense, information rich UIs.
 */
 :root {
  /* light to dark for light theme
   * dark to light for dark theme */
  /* dark to light for light theme
   * light to dark for dark theme */
  --epi2melabs-turquoise: #69BCB8;
  --epi2melabs-yellow: #FECE63;
  --epi2melabs-blue: #007BA6;
  --epi2melabs-darkblue: #0E588B;
  --epi2melabs-darkgrey: #333333;

  --base16-green0: #32532b;
  --base16-green1: #436e39;
  --base16-green-extra: #63a455;
  --base16-green2: #538947;
  --base16-blue0: #4b8aa1;
  --base16-blue1: #609eb5;
  --base16-blue2: #7cafc2;
  --base16-red0: #702e2b;
  --base16-red1: #8e3a37;
  --base16-red-extra: #be5b57;
  --base16-red2: #ab4642;
  --base16-purple0: #66416b;
  --base16-purple1: #7e5185;
  --base16-purple2: #96609e;
  --base16-aqua0: #2f515d;
  --base16-aqua1: #3d6878;
  --base16-aqua-extra: #5b96ab;
  --base16-aqua2: #4b8093;
  --base16-foreground-light: #383838;
  --base16-gray: #bbbbbb;
  --base16-gray-dark: #e4e4e4;
  --base16-yellow0: #ae6b06;
  --base16-yellow1: #d58307;
  --base16-yellow-extra: #f8ab35;
  --base16-yellow2: #f79a0e;
  --base16-orange0: #ae6b06;
  --base16-orange1: #d58307;
  --base16-orange-extra: #f8ab35;
  --base16-orange2: #f79a0e;
  --jp-layout-color0: #f8f8f8;
  --jp-layout-color1: #eeeeee;
  --jp-layout-color2: #e4e4e4;
  --jp-layout-color3: #cfcfcf;
  --jp-layout-color4: #a6a6a6;
  --jp-layout-color5: #929292;
  --jp-layout-color6: #7e7e7e;
  --jp-inverse-layout-color0: #383838;
  --jp-inverse-layout-color1: #4c4c4c;
  --jp-inverse-layout-color2: #616161;
  --jp-inverse-layout-color3: #757575;
  --jp-inverse-layout-color4: #8a8a8a;
  --jp-inverse-layout-color5: #9e9e9e;
  --jp-editor-selected-focused-background: var(--jp-layout-color0);
  --jp-editor-cursor-color: var(--jp-inverse-layout-color0);
  /* Elevation
   *
   * We style box-shadows using Material Design's idea of elevation. These particular numbers are taken from here:
   *
   * https://github.com/material-components/material-components-web
   * https://material-components-web.appspot.com/elevation.html
   */
  /* The dark theme shadows need a bit of work, but this will probably also require work on the core layout
   * colors used in the theme as well. */
  --jp-shadow-base-lightness: 32;
  --jp-shadow-umbra-color: rgba(
    var(--jp-shadow-base-lightness),
    var(--jp-shadow-base-lightness),
    var(--jp-shadow-base-lightness),
    0.2
  );
  --jp-shadow-penumbra-color: rgba(
    var(--jp-shadow-base-lightness),
    var(--jp-shadow-base-lightness),
    var(--jp-shadow-base-lightness),
    0.14
  );
  --jp-shadow-ambient-color: rgba(
    var(--jp-shadow-base-lightness),
    var(--jp-shadow-base-lightness),
    var(--jp-shadow-base-lightness),
    0.12
  );
  --jp-elevation-z0: none;
  --jp-elevation-z1: 0px 2px 1px -1px var(--jp-shadow-umbra-color),
    0px 1px 1px 0px var(--jp-shadow-penumbra-color),
    0px 1px 3px 0px var(--jp-shadow-ambient-color);
  --jp-elevation-z2: 0px 3px 1px -2px var(--jp-shadow-umbra-color),
    0px 2px 2px 0px var(--jp-shadow-penumbra-color),
    0px 1px 5px 0px var(--jp-shadow-ambient-color);
  --jp-elevation-z4: 0px 2px 4px -1px var(--jp-shadow-umbra-color),
    0px 4px 5px 0px var(--jp-shadow-penumbra-color),
    0px 1px 10px 0px var(--jp-shadow-ambient-color);
  --jp-elevation-z6: 0px 3px 5px -1px var(--jp-shadow-umbra-color),
    0px 6px 10px 0px var(--jp-shadow-penumbra-color),
    0px 1px 18px 0px var(--jp-shadow-ambient-color);
  --jp-elevation-z8: 0px 5px 5px -3px var(--jp-shadow-umbra-color),
    0px 8px 10px 1px var(--jp-shadow-penumbra-color),
    0px 3px 14px 2px var(--jp-shadow-ambient-color);
  --jp-elevation-z12: 0px 7px 8px -4px var(--jp-shadow-umbra-color),
    0px 12px 17px 2px var(--jp-shadow-penumbra-color),
    0px 5px 22px 4px var(--jp-shadow-ambient-color);
  --jp-elevation-z16: 0px 8px 10px -5px var(--jp-shadow-umbra-color),
    0px 16px 24px 2px var(--jp-shadow-penumbra-color),
    0px 6px 30px 5px var(--jp-shadow-ambient-color);
  --jp-elevation-z20: 0px 10px 13px -6px var(--jp-shadow-umbra-color),
    0px 20px 31px 3px var(--jp-shadow-penumbra-color),
    0px 8px 38px 7px var(--jp-shadow-ambient-color);
  --jp-elevation-z24: 0px 11px 15px -7px var(--jp-shadow-umbra-color),
    0px 24px 38px 3px var(--jp-shadow-penumbra-color),
    0px 9px 46px 8px var(--jp-shadow-ambient-color);
  /* Borders
   *
   * The following variables, specify the visual styling of borders in JupyterLab.
   */
  --jp-border-width: 1px;
  --jp-border-color0: var(--jp-layout-color1);
  --jp-border-color1: var(--jp-layout-color2);
  --jp-border-color2: var(--jp-layout-color3);
  --jp-border-color3: var(--jp-layout-color5);
  --jp-border-radius: 2px;
  /* UI Fonts
   *
   * The UI font CSS variables are used for the typography all of the JupyterLab
   * user interface elements that are not directly user generated content.
   *
   * The font sizing here is done assuming that the body font size of --jp-ui-font-size1
   * is applied to a parent element. When children elements, such as headings, are sized
   * in em all things will be computed relative to that body size.
   */
  --jp-ui-font-scale-factor: 1.2;
  --jp-ui-font-size0: 0.83333em;
  --jp-ui-font-size1: 13px;
  /* Base font size */
  --jp-ui-font-size2: 1.2em;
  --jp-ui-font-size3: 1.44em;
  --jp-ui-font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica,
    Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
  /*
   * Use these font colors against the corresponding main layout colors.
   * In a light theme, these go from dark to light.
   */
  /* Darkening colors */
  --jp-ui-font-color0: var(--jp-inverse-layout-color0);
  --jp-ui-font-color1: var(--jp-inverse-layout-color1);
  --jp-ui-font-color2: var(--jp-inverse-layout-color3);
  --jp-ui-font-color3: var(--jp-inverse-layout-color5);
  /*
   * Use these against the brand/accent/warn/error colors.
   * These will typically go from light to darker, in both a dark and light theme.
   */
  --jp-ui-inverse-font-color0: var(--base16-gray);
  --jp-ui-inverse-font-color1: var(--base16-gray-dark);
  --jp-ui-inverse-font-color2: var(--jp-layout-color6);
  --jp-ui-inverse-font-color3: var(--jp-layout-color5);
  /* Content Fonts
   *
   * Content font variables are used for typography of user generated content.
   *
   * The font sizing here is done assuming that the body font size of --jp-content-font-size1
   * is applied to a parent element. When children elements, such as headings, are sized
   * in em all things will be computed relative to that body size.
   */
  --jp-content-line-height: 1.6;
  --jp-content-font-scale-factor: 1.2;
  --jp-content-font-size0: 0.83333em;
  --jp-content-font-size1: 14px;
  /* Base font size */
  --jp-content-font-size2: 1.2em;
  --jp-content-font-size3: 1.44em;
  --jp-content-font-size4: 1.728em;
  --jp-content-font-size5: 2.0736em;
  /* This gives a magnification of about 125% in presentation mode over normal. */
  --jp-content-presentation-font-size1: 17px;
  --jp-content-heading-line-height: 1;
  --jp-content-heading-margin-top: 1.2em;
  --jp-content-heading-margin-bottom: 0.8em;
  --jp-content-heading-font-weight: 500;
  /* Shades of the default font color */
  --jp-content-font-color0: var(--jp-inverse-layout-color0);
  --jp-content-font-color1: var(--jp-inverse-layout-color1);
  --jp-content-font-color2: var(--jp-inverse-layout-color3);
  --jp-content-font-color3: var(--jp-inverse-layout-color5);
  --jp-content-link-color: var(--epi2melabs-blue);
  --jp-content-font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI',
    Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji',
    'Segoe UI Symbol';
  /*
   * Code Fonts
   *
   * Code font variables are used for typography of code and other monospaces content.
   */
   --jp-code-font-size: 13px;
   --jp-code-line-height: 1.3077; /* 17px for 13px base */
   --jp-code-padding: 5px; /* 5px for 13px base, codemirror highlighting needs integer px value */
   --jp-code-font-family-default: Menlo, Consolas, 'DejaVu Sans Mono', monospace;
   --jp-code-font-family: var(--jp-code-font-family-default);
 
   /* This gives a magnification of about 125% in presentation mode over normal. */
   --jp-code-presentation-font-size: 16px;
 
   /* may need to tweak cursor width if you change font size */
   --jp-code-cursor-width0: 1.4px;
   --jp-code-cursor-width1: 2px;
   --jp-code-cursor-width2: 4px;
  /* Layout
   *
   * The following are the main layout colors use in JupyterLab. In a light
   * theme these would go from light to dark.
   */
  /* Brand/accent */
  --jp-brand-color0: var(--epi2melabs-blue);
  --jp-brand-color1: var(--epi2melabs-blue);
  --jp-brand-color2: var(--base16-aqua1);
  --jp-brand-color3: var(--base16-aqua0);
  --jp-accent-color0: var(--base16-green2);
  --jp-accent-color1: var(--base16-green-extra);
  --jp-accent-color2: var(--base16-green1);
  --jp-accent-color3: var(--base16-green0);
  /* State colors (warn, error, success, info) */
  --jp-warn-color0: var(--epi2melabs-blue);
  --jp-warn-color1: var(--epi2melabs-yellow);
  --jp-warn-color2: var(--base16-orange1);
  --jp-warn-color3: var(--base16-orange0);
  --jp-error-color0: var(--base16-red2);
  --jp-error-color1: var(--base16-red-extra);
  --jp-error-color2: var(--base16-red1);
  --jp-error-color3: var(--base16-red0);
  --jp-success-color0: var(--base16-green2);
  --jp-success-color1: var(--base16-green-extra);
  --jp-success-color2: var(--base16-green1);
  --jp-success-color3: var(--base16-green0);
  --jp-info-color0: var(--base16-aqua2);
  --jp-info-color1: var(--base16-aqua-extra);
  --jp-info-color2: var(--base16-aqua1);
  --jp-info-color3: var(--base16-aqua0);
  /* Cell specific styles */
  --jp-cell-padding: 5px;
  --jp-cell-collapser-width: 8px;
  --jp-cell-collapser-min-height: 20px;
  --jp-cell-collapser-not-active-hover-opacity: 0.6;
  --jp-cell-editor-background: var(--jp-layout-color1);
  --jp-cell-editor-border-color: var(--base16-gray-dark);
  --jp-cell-editor-active-border-color: var(--epi2melabs-blue);
  --jp-cell-editor-box-shadow: inset 0 0 1px var(--base16-gray-dark);
  --jp-cell-editor-active-background: var(--jp-layout-color1);
  --jp-cell-editor-active-whiteborder-color: var(--base16-gray);
  --jp-cell-prompt-width: 64px;
  --jp-cell-prompt-font-family: 'Source Code Pro', monospace;
  --jp-cell-prompt-letter-spacing: 0px;
  --jp-cell-prompt-opacity: 1;
  --jp-cell-prompt-not-active-opacity: 1;
  --jp-cell-prompt-not-active-font-color: var(--base16-gray);
  --jp-cell-inprompt-font-color: var(--epi2melabs-darkgrey);
  --jp-cell-outprompt-font-color: var(--base16-yellow-extra);
  /* Notebook specific styles */
  --jp-notebook-padding: 10px;
  --jp-notebook-select-background: var(--jp-layout-color2);
  --jp-notebook-multiselected-color: rgba(181, 118, 20, 0.24);
  /* The scroll padding is calculated to fill enough space at the bottom of the
   *notebook to show one single-line cell (with appropriate padding) at the top
   *when the notebook is scrolled all the way to the bottom. We also subtract one
   *pixel so that no scrollbar appears if we have just one single-line cell in the
   *notebook. This padding is to enable a 'scroll past end' feature in a notebook.
   */
  --jp-notebook-scroll-padding: calc(
    100% - var(--jp-code-font-size) * var(--jp-code-line-height) -
      var(--jp-code-padding) - var(--jp-cell-padding) - 1px
  );
  /* Rendermime styles */
  --jp-rendermime-error-background: var(--jp-layout-color0);
  --jp-rendermime-table-row-background: var(--jp-layout-color1);
  --jp-rendermime-table-row-hover-background: rgba(3, 169, 244, 0.2);
  /* Dialog specific styles */
  --jp-dialog-background: rgba(0, 0, 0, 0.6);
  /* Console specific styles */
  --jp-console-padding: 10px;
  /* Toolbar specific styles */
  --jp-toolbar-border-color: var(--jp-border-color2);
  --jp-toolbar-micro-height: 8px;
  --jp-toolbar-background: var(--jp-layout-color1);
  --jp-toolbar-box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.8);
  --jp-toolbar-header-margin: 4px 4px 0px 4px;
  --jp-toolbar-active-background: var(--jp-layout-color0);
  /* Input field styles */
  --jp-input-box-shadow: inset 0 0 1px var(--base16-orange0);
  --jp-input-active-background: var(--jp-layout-color0);
  --jp-input-hover-background: var(--jp-layout-color2);
  --jp-input-background: var(--jp-layout-color2);
  --jp-input-border-color: var(--epi2melabs-blue);
  --jp-input-active-border-color: var(--jp-brand-color1);
  /* General editor styles */
  --jp-editor-selected-background: var(--jp-layout-color2);
  /* Code mirror specific styles */
  --jp-mirror-editor-keyword-color: var(--epi2melabs-darkblue);
  --jp-mirror-editor-atom-color: var(--base16-red2);
  --jp-mirror-editor-number-color: var(--base16-blue1);
  --jp-mirror-editor-def-color: var(--base16-purple2);
  --jp-mirror-editor-variable-color: var(--base16-foreground-light);
  --jp-mirror-editor-variable-2-color: var(--base16-blue2);
  --jp-mirror-editor-variable-3-color: var(--base16-gray);
  --jp-mirror-editor-punctuation-color: var(--base16-orange2);
  --jp-mirror-editor-property-color: var(--base16-purple2);
  --jp-mirror-editor-operator-color: var(--base16-foreground-light);
  --jp-mirror-editor-comment-color: var(--jp-inverse-layout-color4);
  --jp-mirror-editor-string-color: var(--epi2melabs-blue);
  --jp-mirror-editor-string-2-color: var(--base16-green1);
  --jp-mirror-editor-meta-color: var(--base16-yellow1);
  --jp-mirror-editor-qualifier-color: var(--base16-green1);
  --jp-mirror-editor-builtin-color: var(--base16-orange2);
  --jp-mirror-editor-bracket-color: var(--base16-foreground-light);
  --jp-mirror-editor-tag-color: var(--base16-aqua1);
  --jp-mirror-editor-attribute-color: var(--base16-blue1);
  --jp-mirror-editor-header-color: var(--base16-blue1);
  --jp-mirror-editor-quote-color: var(--base16-green1);
  --jp-mirror-editor-link-color: var(--base16-orange0);
  --jp-mirror-editor-error-color: var(--base16-red2);
  --jp-mirror-editor-hr-color: var(--base16-gray);
  /* Vega extension styles */
  --jp-vega-background: var(--jp-layout-color6);
  /* Sidebar-related styles */
  --jp-sidebar-min-width: 180px;
  /* Search-related styles */
  --jp-search-toggle-off-opacity: 0.5;
  --jp-search-toggle-hover-opacity: 0.75;
  --jp-search-toggle-on-opacity: 1;
  /* scrollbar related styles. Supports every browser except Edge.
   * On Firefox, only the color settings are respected.
   */
  --jp-scrollbar-background-color: var(--jp-layout-color0);
  --jp-scrollbar-endpad: 3px;
  /* the minimum gap between the thumb and the ends of a scrollbar */
  --jp-scrollbar-thumb-color: 213, 196, 161;
  /* need to specify thumb color as an RGB triplet */
  --jp-scrollbar-thumb-margin: 5px;
  /* the space in between the sides of the thumb and the track */
  --jp-scrollbar-thumb-radius: 9px;
  /* set to a large-ish value for rounded endcaps on the thumb */ }

/*# sourceMappingURL=variables.css.map */