/* override typography */
.prose {
    max-width: 65ch;
    color: rgb(44, 62, 80);
}
.prose ol, .prose ul {
    list-style: none;
    margin: 0;
    padding: 0;
}
.prose img {
    max-width: 100%;
}
.prose pre {
    overflow-x: auto;
    min-width: fit-content;
    max-width: calc(100vw - 350px);
    background: #1E1E1E;
}
.prose code {
    color: #3b82f6;
    font-weight: 400;
    font-size: .875em;
    background-color: #eff6ff;
    border-radius: 0.25rem;
    padding: 0.25em 0.5rem;
}
.prose code::before, .prose code::after {
    content: ""
}
.prose a {
    color: inherit;
    font-weight: 500;
    text-decoration: underline;
}
.prose a:hover {
    opacity: .8;
    color: #4b5563;
}
.prose blockquote {
    border-left-style: solid;
}

.dark .prose, .dark .prose td {
    color: rgb(209 213 219); /*text-gray-300*/
}
.dark .prose h1, .dark .prose h2, .dark .prose h3, .dark .prose h4, .dark .prose h5, .dark .prose h6, .dark .prose th {
    color: rgb(243 244 246); /*text-gray-100*/
}
.dark .prose code {
    background-color: rgb(30 58 138); /*text-blue-900*/
    color: rgb(243 244 246); /*text-gray-100*/
}
.dark .prose pre>code {
    background-color: transparent;
}

.html-format {
    max-width: unset;
}

@media (min-width: 1024px) {
    .lg\:prose-xl {
        font-size: 1.25rem;
        line-height: 1.8;
    }
}
.youtube {
    width: 896px;
    height: 525px;
}
@media (max-width: 896px) {
    .youtube {
        width: 100%;
        height: auto;
    }
}
.prose pre::-webkit-scrollbar {
    width: 8px;
    height: 8px;
    background: #2d3748;
}
.prose pre::-webkit-scrollbar-thumb {
    background-color: rgb(100 116 139);
}

/*!
  Theme: OneDark
  Author: Lalit Magant (http://github.com/tilal6991)
  License: ~ MIT (or more permissive) [via base16-schemes-source]
  Maintainer: @highlightjs/core-team
  Version: 2021.09.0
*/
/*
  WARNING: DO NOT EDIT THIS FILE DIRECTLY.

  This theme file was auto-generated from the Base16 scheme onedark
  by the Highlight.js Base16 template builder.

  - https://github.com/highlightjs/base16-highlightjs
*/
/*
base00  #282c34  Default Background
base01  #353b45  Lighter Background (Used for status bars, line number and folding marks)
base02  #3e4451  Selection Background
base03  #545862  Comments, Invisibles, Line Highlighting
base04  #565c64  Dark Foreground (Used for status bars)
base05  #abb2bf  Default Foreground, Caret, Delimiters, Operators
base06  #b6bdca  Light Foreground (Not often used)
base07  #c8ccd4  Light Background (Not often used)
base08  #e06c75  Variables, XML Tags, Markup Link Text, Markup Lists, Diff Deleted
base09  #d19a66  Integers, Boolean, Constants, XML Attributes, Markup Link Url
base0A  #e5c07b  Classes, Markup Bold, Search Text Background
base0B  #98c379  Strings, Inherited Class, Markup Code, Diff Inserted
base0C  #56b6c2  Support, Regular Expressions, Escape Characters, Markup Quotes
base0D  #61afef  Functions, Methods, Attribute IDs, Headings
base0E  #c678dd  Keywords, Storage, Selector, Markup Italic, Diff Changed
base0F  #be5046  Deprecated, Opening/Closing Embedded Language Tags, e.g. <?php ?>

pre code.hljs {
  display: block;
  overflow-x: auto;
  padding: 1em;
}
code.hljs {
  padding: 3px 5px;
}
*/
.hljs {
    color: #DADCDC;
    background: #1E1E1E;
}

.hljs::selection,
.hljs ::selection {
  background-color: #3e4451;
  color: #abb2bf;
}


/* purposely do not highlight these things */
.hljs-formula,
.hljs-params,
.hljs-property
{}

/* base03 - #545862 -  Comments, Invisibles, Line Highlighting */
.hljs-comment {
    color: #4CA64A;
}

/* base04 - #565c64 -  Dark Foreground (Used for status bars) */
.hljs-tag {
  color: #565c64;
}

/* base05 - #abb2bf -  Default Foreground, Caret, Delimiters, Operators */
.hljs-subst,
.hljs-punctuation,
.hljs-operator {
  color: #DCDCD8;
}

.hljs-operator {
  opacity: 0.7;
}

/* base08 - Variables, XML Tags, Markup Link Text, Markup Lists, Diff Deleted */
.hljs-bullet,
.hljs-variable,
.hljs-template-variable,
.hljs-selector-tag,
.hljs-name,
.hljs-deletion,
.hljs-attr,
.hljs-tag {
    color: #009898;
}

/* base09 - Integers, Boolean, Constants, XML Attributes, Markup Link Url */
.hljs-symbol,
.hljs-number,
.hljs-link,
.hljs-variable.constant_,
.hljs-literal {
  color: #B5CE9A;
}

/* base0A - Classes, Markup Bold, Search Text Background */
.hljs-title,
.hljs-class .hljs-title,
.hljs-title.class_ {
    color: #4EC9A0;
}

.hljs-strong {
  font-weight:bold;
  color: #e5c07b;
}

/* base0B - Strings, Inherited Class, Markup Code, Diff Inserted */
.hljs-code,
.hljs-addition,
.hljs-title.class_.inherited__,
.hljs-string,
.hljs-meta .hljs-string {
  color: #D69D85;
}
.cshtml-razor .hljs-string, .cshtml-razor .hljs-meta .hljs-string, .language-xml .hljs-string {
    color: #DCDAC8;
}

/* base0C - Support, Regular Expressions, Escape Characters, Markup Quotes */
.hljs-built_in,
.hljs-doctag, /* guessing */
.hljs-quote,
.hljs-keyword.hljs-atrule,
.hljs-regexp {
    color: #449CD6;
}
.cshtml-razor .hljs-built_in {
    color: #A699E6;
}

/* base0D - Functions, Methods, Attribute IDs, Headings */
.hljs-function .hljs-title,
.hljs-attribute,
.ruby .hljs-property,
.hljs-title.function_,
.hljs-section {
  color: #DADCDC;
}

/* base0E - Keywords, Storage, Selector, Markup Italic, Diff Changed */
.hljs-type,
/* .hljs-selector-id, */
/* .hljs-selector-class, */
/* .hljs-selector-attr, */
/* .hljs-selector-pseudo, */
.hljs-template-tag,
.diff .hljs-meta,
.hljs-keyword {
  color: #449CD6;
}
.hljs-emphasis {
  color: #c678dd;
  font-style: italic;
}

/* base0F - Deprecated, Opening/Closing Embedded Language Tags, e.g. <?php ?> */
.hljs-meta,
/*
  prevent top level .keyword and .string scopes
  from leaking into meta by accident
*/
.hljs-meta .hljs-keyword {
  color: #4EC9A0;
}

.hljs-meta .hljs-keyword,
/* for v10 compatible themes */
.hljs-meta-keyword {
  font-weight: bold;
}
