/* =======================================
            Container Definitions
======================================== */

/* For Notebooks: Change Background */
.notebook_app {
    background-color: var(--pri);
}

/* Remove border in container */
#notebook-container {
    max-width: 750px;
    width: 95%;
    padding: 0px 20px;
    background-color: inherit;
    -webkit-box-shadow: inherit;
    box-shadow: inherit;
}

/* Make sure that we inherit default
font size from body */
div#notebook { 
  padding: 0px; /* To make sure that iframe does not get cut off */
  font-size: inherit; 
}

/* Make sure that there is no padding
for md cell or python cell */
div.cell, div.text_cell_render {
  padding-left: 0px;
  padding-right: 0px;
}
/* =======================================
            Headers & Paragraphs
======================================== */

h1,h2,h3,h4,h5,h6
.h1,.h2,.h3,.h4,.h5,.h6 {
  margin-top: 2rem;
  margin-bottom: 2rem;
}

p {
    margin-bottom: 1rem;
}

/* Enable liaising to make font smoother */
body {
	-webkit-font-smoothing: antialiased;
}

/* Remove Anchor Links */
.anchor-link { display:none }

/* =======================================
           Title, Author and Dates
======================================== */

h4 .meta {
  color: var(--font-color-50);
  font-style:normal;

}

h4.author {
  font-size: 1.5em;
  margin-bottom: 0.5rem;
}

h4.date {
  font-size: 1.1em;
  margin-top: 0.5rem;
}

/*
=========================================
    Code Blocks
=========================================
*/
/* Remove Prefix Prompt */
div.prompt { display:none }

/* Change code type */
.CodeMirror pre, 
div.input_area > div.highlight > pre, 
div.output_area pre {
  font-family: var(--code-family);
}

/* Code Blocks: Code */
div.input {
    margin: 1rem 0px;
    /* by default hide */
    display: none;
}
/* For Notebooks: show */
.notebook_app div.input {
    display: inherit;
}
div.input_area {

  background-color: var(--pri);
  padding: 0px 1rem;

  border-radius: 0px;
  border-width: 0px;
  border-left: 5px solid var(--font-color-50);
  
  color: var(--font-color);
  font-size: 90%;

}
/* Code Blocks: Syntax */
/* comment */
.highlight .c1,
.cm-s-ipython span.cm-comment,
.cm-s-ipython span.cm-error { color: var(--font-color); opacity: 0.5; }
/* functions and variables */
.highlight .nn,
.highlight .nc,
.highlight .nb,
.highlight .bp,
.highlight .nf,
.cm-s-ipython span.cm-variable, 
.cm-s-ipython span.cm-builtin,
.cm-s-ipython span.cm-def { color: var(--color-1); }
/* string */
.highlight .s1,
.highlight .s2,
.highlight .si,
.highlight .se,
.cm-s-ipython span.cm-string { color: var(--color-2); }
/* literal - boolean or NA */
.highlight .k,
.highlight .kn,
.highlight .kc,
.highlight .ow,
.cm-s-ipython span.cm-keyword { color: var(--color-3); }
/* number */
.highlight .mi,
.highlight .mf,
.highlight .o,
.cm-s-ipython span.cm-number,
.cm-s-ipython span.cm-operator { color: var(--color-4); }

/* Code Blocks: Results */
div.output_text {
  min-width: 100%;

  background-color: var(--pri);
  padding: 0px 1rem;

  border-radius: 0px;
  border-width: 0px;
  border-left: 5px solid var(--font-color-75);
  
  color: var(--font-color);
}


/*
=========================================
    Section Codes
=========================================
*/
.code-fold-btn {
  font-size: 1em;
  float: right !important;
  background-color: transparent;
  color: var(--font-color);
  border-width: 0px;
}
/* Code not being shown */
.code-fold-btn[cshown="false"] {
  color: var(--font-color-75);
  background-color: transparent;
  border-color: transparent;
}
/* Code being shown */
.code-fold-btn[cshown="true"] {
  color: var(--pri);
  background-color: var(--font-color-75); 
  border-color: transparent;
}

/* hover*/
.code-fold-btn:hover {
  color: var(--pri);
  background-color: var(--font-color-50); 
  border-color: transparent;
}
/*
=========================================
    "All" Codes
=========================================
*/
.code-show-all, .code-hide-all {
  font-size: 1em;
  float: right !important;
  background-color: transparent;
  color: var(--heading-color-75);
  border-width: 0px;
  margin: 0px 5px;
}

/* hover*/
.code-show-all:hover, 
.code-hide-all:hover {
  color: var(--pri);
  background-color: var(--heading-color-50); 
  border-color: transparent;
}
/*
=========================================
   Images and Interactive Plots
=========================================
*/
/* Centerize */
.output_png.output_subarea,
.output_html.output_subarea {
  min-width: 100%;
}
.output_png.output_subarea,
.output_html.output_subarea,
.plotly-graph-div.js-plotly-plot,
div.output_area img,
div.output_area svg,
.svg-container {
  margin-left: auto !important;
  margin-right: auto !important;	
}

div.output_area img {
	display: block;
}

/*
=========================================
    Tables
=========================================
*/

/* Tables */
table {
  width: auto !important;
  min-width: 500px;
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
}

/* Cell Adjustments */
th, td {
  padding:  1rem 2rem;
}

/* Normal Cells */
table {
  font-family: var(--font-family);
  border-color: transparent;
}

td {
  color: var(--font-color);
}

/* Header Cells */
th {
  font-weight: normal;
  color: var(--heading-color);
}

thead tr
{
  padding-top: 1rem;
  padding-bottom: 1rem;
}

thead tr:last-child th
{
  border-bottom: 1px solid var(--heading-color);
}


/*
=========================================
   Highlights
=========================================
*/
.hl {
  font-weight: bold;
  color: var(--heading-color);
}
.st {
  display: block;
  padding: 0.5rem 0px 0.5rem 1rem;
  margin: 2rem 0px 2rem 0px;
  color: var(--font-color);
  font-weight: 500;
  border-left: 5px solid var(--font-color);
}