/* ==================================================================
    REPL HELP BLOCKS
================================================================== */

.repl-help {
    background-color: lightgray;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 1px;
    padding-bottom: 1px;
    border-radius: 10px;
    margin-bottom: 1em;
  }
  
  .repl-help h1,h2,h3 {
    font-size: 1em;
    font-weight: 500;
  }

/* ==================================================================
    BADGES
================================================================== */

.im-badge {text-align: center;}
.im-badge img {
    height: 1em;
    object-fit: scale-down;
}

/* Custom CSS required to display the docs|stable badge on the landing page */
img[alt=badge] {
  height: 1em;
  width: auto;
  display: inline;
  margin: 0;
  padding: 0 0.5ex;
}

/* ==================================================================
    Admonitions
================================================================== */

.tldr {
  background-color: rgba(34, 139, 34, 0.291);
  border-radius: 10px;
  padding: 0.5em;
  margin-bottom: 1em;
}

.tldr p {
  margin-bottom: 0em;
}

.advanced {
  background: #cb3d337a;
  border-radius: 10px;
  padding: 0.5em;
  margin-bottom: 1em;
}

.vscode {
  background-color: #9558b248;
  border-radius: 10px;
  padding: 0.5em;
  margin-bottom: 1em;
}

.important {
  background-color: #2ebe4448;
  border-radius: 10px;
  padding: 0.5em;
  margin-bottom: 1em;
}

/* ==================================================================
    HLJS CODE BLOCKS
================================================================== */

.hljs {
  position: relative;
  font-size: var(--small);
  line-height: 1.35em;
  border-radius: 10px;
}

.hljs-meta { font-weight: bold;}

/* Use colors from theme specified in style.html */
.hljs-meta.prompt_ {color: #7ee787;}
.hljs-meta.help_ {color: #f2cc60;}
.hljs-meta.shell_ {color: #ff7b72;}
.hljs-meta.infiltrator_ {color: #ffa657;}
.hljs-meta.debugger_ {color: #ffa657;}
.hljs-meta.debuggereval_ {color: #ffa657;}

/* Add language name to code blocks */
.hljs::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  padding: 0.2rem 0.5rem 0.1rem;
  background-color: #27303c; /* brighter than #0d1117 */
  border-bottom-right-radius:10px;
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
}

/* Define language names shown in code blocks */
.language-bash::before       {content: "Shell";}
.language-toml::before       {content: "TOML";}
.language-ini::before       {content: "TOML";}
.language-julia::before      {content: "Julia";}
/* Special Franklin tags for Julia REPL modes */ 
.language-julia-repl::before {content: "Julia REPL";}
.julia-repl::before          {content: "Julia REPL";}
.julia-repl-pkg::before      {content: "Julia REPL: Pkg mode";}
.julia-repl-help::before     {content: "Julia REPL: Help mode";}
.julia-repl-shell::before    {content: "Julia REPL: Shell mode";}
/* Julia code after REPL prompts doesn't need a language tag */
.language-julia-repl .language-julia::before {content: "";}
.julia-repl          .language-julia::before {content: "";}
.julia-repl-pkg      .language-julia::before {content: "";}
.julia-repl-help     .language-julia::before {content: "";}
.julia-repl-shell    .language-julia::before {content: "";}
/* Julia code in doc strings printed via REPL Help mode is sometimes incorrectly 
recognized as Ruby code. Since we don't have any Ruby code in MJW, this is a quick fix. 
TODO: remove when not required in Xranklin.
*/
.language-ruby::before {content: "Julia";}

.code-result::before {content: "Result"; padding: 0.05rem 0.5rem 0.05rem;}
.code-stdout::before {content: "Result"; padding: 0.05rem 0.5rem 0.05rem;}
.code-result {background-color: #394758 !important;}
.code-stdout {background-color: #394758 !important;}


@font-face {
    font-family: JuliaMono-Light;
    /* src: url("https://cdn.jsdelivr.net/gh/cormullion/juliamono-webfonts/JuliaMono-Black.woff2");*/
    src: url("https://cdn.jsdelivr.net/gh/cormullion/juliamono/webfonts/JuliaMono-Light.woff2");
}

pre {
	position: relative;
	/* padding: 30px; */
}

.copy-button {
	cursor: pointer;
	border: 0;
	font-size: 10px;
	text-transform: uppercase;
	font-weight: 500;
	padding: 6px 10px 10px;
	color: #795548;
	background-color: transparent;
	position: absolute;
	top: 0;
	right: 0;
}

.copy-button:hover,
.copy-button:focus,
.copy-button:active {
	outline: 0;
	background-color: #eee9e6;
}