/* We brought back Roboto.  It is easier to develop, especially when we need
 * to cram lots of things in tight spaces, if everyone uses the same font.
 */
@font-face {
    font-family: 'Roboto';
    src: url("../fonts/Roboto-Bold-webfont.50d75e48e0a3.woff");
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'Roboto';
    src: url("../fonts/Roboto-Regular-webfont.35b07eb2f871.woff");
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Roboto';
    src: url("../fonts/Roboto-Light-webfont.c73eb1ceba33.woff");
    font-weight: 300;
    font-style: normal;
}

.emoji-text {
    font-family: "DejaVu Sans","Bitstream Vera Sans",Verdana,Arial,sans-serif;
}

html[data-theme="light"], :root {
    --font-family-primary:
        Roboto,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        system-ui,
        "Helvetica Neue",
        Arial,
        sans-serif,
        "Apple Color Emoji",
        "Segoe UI Emoji",
        "Segoe UI Symbol",
        "Noto Color Emoji";

    --header-branding-color: var(--primary-fg);
}

html[data-theme="dark"] {
    --body-quiet-color: #a3a3a3;
}
/* dark_mode.css does it this way. */
@media (prefers-color-scheme: dark) {
    :root {
        --body-quiet-color: #a3a3a3;
    }
}

/* This feels like a bug.  --header-branding-color is not used. */
#site-name {
    color: var(--header-branding-color);
}
#site-name, #site-name a:link, #site-name a:visited {
    color: var(--header-branding-color);
}

/* Django 5.0 changed the background of these headings from --primary to
 * --header-bg (--secondary).  We keep --primary, which dark_mode.css makes
 * darker. */
.module h2, .module caption, .inline-group h2 {
    background: var(--primary);
}

/* Django 5.0 removed the quiet color from h1 and changed h3 to the new,
 * different medium color, and gave h4 that color too.  Restore the Django 4.2
 * colors. */
h1, h3 {
    color: var(--body-quiet-color);
}
h4 {
    color: inherit;
}

/* Django 5.0 lightened table headers from 600 to 500. */
th {
    font-weight: 600;
}

/* Django 5.0 made required column headers bold and dropped their color. */
thead th.required {
    color: var(--body-loud-color);
    font-weight: 600;
}

/* Django 5.0 made the theme switch icon 1.5rem, up from 1rem. */
.theme-toggle svg {
    height: 1rem;
    width: 1rem;
}

/* Django 5.0 made the calendar and clock icons 24px (they were 16px) and
 * turned .related-widget-wrapper into a wrapping flexbox.  Restore the
 * Django 4.2 rules.  widgets.css loads after this file on change forms, so
 * these use "body" to win on specificity. */
body .datetimeshortcuts .clock-icon,
body .datetimeshortcuts .date-icon {
    height: 16px;
    width: 16px;
    background-size: auto;
}
body .datetimeshortcuts a:focus .clock-icon,
body .datetimeshortcuts a:hover .clock-icon,
body .datetimeshortcuts a:focus .date-icon,
body .datetimeshortcuts a:hover .date-icon {
    background-position: 0 -16px;
}

body .related-widget-wrapper {
    display: block;
    float: left;       /* display properly in form rows with multiple fields */
    overflow: hidden;  /* clear floated contents */
    margin-bottom: 0;
}
body .related-widget-wrapper-link {
    opacity: 0.3;
    filter: none;
}
body .related-widget-wrapper-link:link {
    opacity: .8;
    filter: none;
}
body .related-widget-wrapper-link:link:focus,
body .related-widget-wrapper-link:link:hover {
    opacity: 1;
}
body select + .related-widget-wrapper-link,
body .related-widget-wrapper-link + .related-widget-wrapper-link {
    margin-left: 7px;
}

/* Disable centering from responsive.css. */
@media (max-width: 1024px)
{
    header#header
    {
        flex-direction: row;
        justify-content: space-between;
    }
}

body {
    background: var(--darkened-bg);
}

/* Disable alternating row color on layout rows. */
tr.layout:nth-child(odd), tr.layout:nth-child(even)
{
    background: var(--darkened-bg);
}

#user-tools {
    font-size: 15px;
    font-weight: 300;
    text-transform: initial;
}

thead th abbr {
    text-transform: none;
}

/* Re-enable color for links in table headers. */
thead th a:link, thead th a:visited {
    color: var(--link-fg);
}
thead th a:focus, thead th a:hover {
    color: var(--link-hover-color);
}

@media (max-width: 767px) {
    .aligned .form-row input[type="checkbox"] {
        flex: inherit;
    }
}

/* By default, the autocomplete boxes are greyed out when disabled, but
 * regular inputs are not. */
input[type=text][disabled], input[type=password][disabled],
input[type=email][disabled], input[type=url][disabled],
input[type=number][disabled], input[type=tel][disabled], textarea[disabled],
select[disabled], .vTextField[disabled] {
    background-color: var(--darkened-bg);
}

/* This feels like a bug.  A <button> in the submit-row gets its padding from
 * from the `form .button` rule, because that selector is more specific than
 * `.button` in base.css.  It gets its margin from the same rule because
 * `.submit-row input, .submit-row a` in forms.css does not match.
 * This applies to the Previous button on the Add Internet Service wizard. */
.submit-row button.button {
    padding: 10px 15px;
    margin: 0;
}

.strikethrough,
li.select2-results__option:has(.strikethrough-result) {
    text-decoration: line-through;
}

.strikethrough:hover,
li.select2-results__option:has(.strikethrough-result):hover {
    text-decoration: none;
}

/* Allow selecting text out of the select2 autocomplete boxes. */
span.select2-selection__rendered {
    user-select: text;
}
.select2-selection__clear {
    user-select: none;
}
.select2-container--open span.select2-selection__rendered {
    cursor: text;
}

/* When a DAL (django-autocomplete-light) field is disabled, the select2
 * autocomplete gets background-color: aaa which makes the box completely
 * white. */
html[data-theme="dark"] .select2-container--default.select2-container--disabled .select2-selection--single {
  background-color: var(--darkened-bg) !important;
}
/* dark_mode.css does it this way. */
@media (prefers-color-scheme: dark) {
  .select2-container--default.select2-container--disabled .select2-selection--single {
    background-color: var(--darkened-bg) !important;
  }
}


/* COMMENTS */

.form-row.comments_table
{
    padding: 2px 0 0 0;
    border-bottom: none;
}

.comment {
    padding: 5px 10px 5px 10px;
    border-bottom: 1px solid var(--hairline-color);
    font-size: 13px;
}

.aligned .form-row div.comment_hidden_hide {
    display: none;
}

.comment p {
    padding: 0px;
    margin: 0px;
}

.comment p + p,
.comment p + pre,
.comment pre + p,
.comment pre + pre
{
    padding-top: 10px;
}

.comment pre {
    border: 0;
    padding: 2px 0 0 0;
    margin: 0;
}

/* Scale images down (keeping the aspect ratio) to fit. */
.comment img {
    max-width: 100%;
    max-height: 400px;
}

/* Set this back to the normal th size. */
.comment thead th
{
    font-size: 0.8125rem;
}

.comment-prefix {
    color: var(--body-quiet-color);
    font-size: 11px;
    vertical-align: middle;
}

@media (max-width: 767px) {
    .comment-header {
        flex: 1 1 100%;
    }
}

.comment-namedate-wrapper {
    order: -1;
    padding-bottom: 5px;
    padding-right: 2px;
}

.comment-hide-unhide {
    /* float is for wider screens.  When the parent goes flex on smaller
     * screens, float does not apply and we use margin-left and order. */
    float: right;
    margin-left: auto;
    width: 16px;
    height: 16px;
}

.comment-form-manage {
    padding: 10px 10px 10px 10px;
}

.comment-form textarea, .comment-form-manage textarea {
    width: 500px;
    height: 1.5em;
}

.comment-form .EasyMDEContainer {
    width: 500px;
    max-width: 100%;
}

img.help  {
    cursor: help;
}

#id_comment_add-attachments {
    margin-bottom: 0;
    margin-left: 0;
    padding-left: 0;
}

.comment-loading-icon  {
    vertical-align: middle;
    display: none;
    padding: 3px 0;
}

.comment-loading-icon-hide-unhide {
    vertical-align: middle;
    display: none;
    float: right;
}

/* The second selector is to win over `form .aligned.case ul` in case.css. */
form div.comment ul,
form .aligned.case div.comment ul,
form div.comment ol {
    padding: 0 10px 0 10px;
    margin: 0.2em 0 0.8em 1.5em;
}
form div.comment ul li {
    list-style-type: square;
}

form div.comment ul.attachments {
    padding-left: 0;
}

form div.comment ul.attachments li {
    list-style-type: none;
}

form div.comment ul.attachments li figure {
    margin: 0;
}

.comments_table div:first-child {
    border-top: 0;
}

.comment-customer-visible,
.comment-customer-invisible
{
        opacity: 0.4;
}

span.mobile-only {
    display: none;
}

@media (max-width: 767px)
{
    .aligned .form-row > div.comment {
        /* Turn off display: flex. */
        display: block;
    }
    .aligned .form-row > div.comment_hidden_hide {
        display: none;
    }

    span.mobile-only {
        display: inline;
    }
    span.mobile-hide {
        display: none;
    }
}

/* This starts with the Pygments "default" and "github-dark" styles:
 *   pygmentize -S default     -f html -a .highlight
 *   pygmentize -S github-dark -f html -a .highlight
 *
 * They are then merged together, with colors converted to CSS variables, and
 * structured to honor the Django theme selector.  The selectors are limited to
 * .comment, so e.g. we don't modify <pre> anywhere else.
 *
 * Where the non-color styles (font-style, font-weight, and err border)
 * differed, we kept the styles from github-dark.
 *
 * We customized pygments-highlight-bg in dark mode to #1a1a1a for more
 * contrast.
 */

:root,
html[data-theme="light"] {
    --pygments-linenos: currentColor;
    --pygments-linenos-bg: transparent;
    --pygments-linenos-special: #000000;
    --pygments-linenos-special-bg: #ffffc0;
    --pygments-hll-bg: #ffffcc;
    --pygments-highlight-bg: #f8f8f8;
    --pygments-highlight: currentColor;
    --pygments-c: #3D7B7B; /* Comment */
    --pygments-err: currentColor; /* Error */
    --pygments-esc: currentColor; /* Escape */
    --pygments-g: currentColor; /* Generic */
    --pygments-k: #008000; /* Keyword */
    --pygments-l: currentColor; /* Literal */
    --pygments-n: currentColor; /* Name */
    --pygments-o: #666; /* Operator */
    --pygments-x: currentColor; /* Other */
    --pygments-p: currentColor; /* Punctuation */
    --pygments-ch: #3D7B7B; /* Comment.Hashbang */
    --pygments-cm: #3D7B7B; /* Comment.Multiline */
    --pygments-cp: #9C6500; /* Comment.Preproc */
    --pygments-cpf: #3D7B7B; /* Comment.PreprocFile */
    --pygments-c1: #3D7B7B; /* Comment.Single */
    --pygments-cs: #3D7B7B; /* Comment.Special */
    --pygments-gd: #A00000; /* Generic.Deleted */
    --pygments-gd-bg: transparent;
    --pygments-ge: currentColor; /* Generic.Emph */
    --pygments-ges: currentColor; /* Generic.EmphStrong */
    --pygments-gr: #E40000; /* Generic.Error */
    --pygments-gh: #000080; /* Generic.Heading */
    --pygments-gi: #008400; /* Generic.Inserted */
    --pygments-gi-bg: transparent;
    --pygments-go: #717171; /* Generic.Output */
    --pygments-gp: #000080; /* Generic.Prompt */
    --pygments-gs: currentColor; /* Generic.Strong */
    --pygments-gu: #800080; /* Generic.Subheading */
    --pygments-gt: #04D; /* Generic.Traceback */
    --pygments-g-Underline: currentColor; /* Generic.Underline */
    --pygments-kc: #008000; /* Keyword.Constant */
    --pygments-kd: #008000; /* Keyword.Declaration */
    --pygments-kn: #008000; /* Keyword.Namespace */
    --pygments-kp: #008000; /* Keyword.Pseudo */
    --pygments-kr: #008000; /* Keyword.Reserved */
    --pygments-kt: #B00040; /* Keyword.Type */
    --pygments-ld: currentColor; /* Literal.Date */
    --pygments-m: #666; /* Literal.Number */
    --pygments-s: #BA2121; /* Literal.String */
    --pygments-na: #687822; /* Name.Attribute */
    --pygments-nb: #008000; /* Name.Builtin */
    --pygments-nc: #00F; /* Name.Class */
    --pygments-no: #800; /* Name.Constant */
    --pygments-nd: #A2F; /* Name.Decorator */
    --pygments-ni: #717171; /* Name.Entity */
    --pygments-ne: #CB3F38; /* Name.Exception */
    --pygments-nf: #00F; /* Name.Function */
    --pygments-nl: #767600; /* Name.Label */
    --pygments-nn: #00F; /* Name.Namespace */
    --pygments-nx: currentColor; /* Name.Other */
    --pygments-py: currentColor; /* Name.Property */
    --pygments-nt: #008000; /* Name.Tag */
    --pygments-nv: #19177C; /* Name.Variable */
    --pygments-ow: #A2F; /* Operator.Word */
    --pygments-pm: currentColor; /* Punctuation.Marker */
    --pygments-w: #BBB; /* Text.Whitespace */
    --pygments-mb: #666; /* Literal.Number.Bin */
    --pygments-mf: #666; /* Literal.Number.Float */
    --pygments-mh: #666; /* Literal.Number.Hex */
    --pygments-mi: #666; /* Literal.Number.Integer */
    --pygments-mo: #666; /* Literal.Number.Oct */
    --pygments-sa: #BA2121; /* Literal.String.Affix */
    --pygments-sb: #BA2121; /* Literal.String.Backtick */
    --pygments-sc: #BA2121; /* Literal.String.Char */
    --pygments-dl: #BA2121; /* Literal.String.Delimiter */
    --pygments-sd: #BA2121; /* Literal.String.Doc */
    --pygments-s2: #BA2121; /* Literal.String.Double */
    --pygments-se: #AA5D1F; /* Literal.String.Escape */
    --pygments-sh: #BA2121; /* Literal.String.Heredoc */
    --pygments-si: #A45A77; /* Literal.String.Interpol */
    --pygments-sx: #008000; /* Literal.String.Other */
    --pygments-sr: #A45A77; /* Literal.String.Regex */
    --pygments-s1: #BA2121; /* Literal.String.Single */
    --pygments-ss: #19177C; /* Literal.String.Symbol */
    --pygments-bp: #008000; /* Name.Builtin.Pseudo */
    --pygments-fm: #00F; /* Name.Function.Magic */
    --pygments-vc: #19177C; /* Name.Variable.Class */
    --pygments-vg: #19177C; /* Name.Variable.Global */
    --pygments-vi: #19177C; /* Name.Variable.Instance */
    --pygments-vm: #19177C; /* Name.Variable.Magic */
    --pygments-il: #666; /* Literal.Number.Integer.Long */
}

@media (prefers-color-scheme: dark) {
    html:not([data-theme="light"]) {
        --pygments-linenos: #6e7681;
        --pygments-linenos-bg: #0d1117;
        --pygments-linenos-special: #e6edf3;
        --pygments-linenos-special-bg: #6e7681;
        --pygments-hll-bg: #6e7681;
        --pygments-highlight-bg: #1a1a1a;
        --pygments-highlight: #E6EDF3;
        --pygments-c: #8B949E; /* Comment */
        --pygments-err: #F85149; /* Error */
        --pygments-esc: #E6EDF3; /* Escape */
        --pygments-g: #E6EDF3; /* Generic */
        --pygments-k: #FF7B72; /* Keyword */
        --pygments-l: #A5D6FF; /* Literal */
        --pygments-n: #E6EDF3; /* Name */
        --pygments-o: #FF7B72; /* Operator */
        --pygments-x: #E6EDF3; /* Other */
        --pygments-p: #E6EDF3; /* Punctuation */
        --pygments-ch: #8B949E; /* Comment.Hashbang */
        --pygments-cm: #8B949E; /* Comment.Multiline */
        --pygments-cp: #8B949E; /* Comment.Preproc */
        --pygments-cpf: #8B949E; /* Comment.PreprocFile */
        --pygments-c1: #8B949E; /* Comment.Single */
        --pygments-cs: #8B949E; /* Comment.Special */
        --pygments-gd: #FFA198; /* Generic.Deleted */
        --pygments-gd-bg: #490202;
        --pygments-ge: #E6EDF3; /* Generic.Emph */
        --pygments-ges: #E6EDF3; /* Generic.EmphStrong */
        --pygments-gr: #FFA198; /* Generic.Error */
        --pygments-gh: #79C0FF; /* Generic.Heading */
        --pygments-gi: #56D364; /* Generic.Inserted */
        --pygments-gi-bg: #0F5323;
        --pygments-go: #8B949E; /* Generic.Output */
        --pygments-gp: #8B949E; /* Generic.Prompt */
        --pygments-gs: #E6EDF3; /* Generic.Strong */
        --pygments-gu: #79C0FF; /* Generic.Subheading */
        --pygments-gt: #FF7B72; /* Generic.Traceback */
        --pygments-g-Underline: #E6EDF3; /* Generic.Underline */
        --pygments-kc: #79C0FF; /* Keyword.Constant */
        --pygments-kd: #FF7B72; /* Keyword.Declaration */
        --pygments-kn: #FF7B72; /* Keyword.Namespace */
        --pygments-kp: #79C0FF; /* Keyword.Pseudo */
        --pygments-kr: #FF7B72; /* Keyword.Reserved */
        --pygments-kt: #FF7B72; /* Keyword.Type */
        --pygments-ld: #79C0FF; /* Literal.Date */
        --pygments-m: #A5D6FF; /* Literal.Number */
        --pygments-s: #A5D6FF; /* Literal.String */
        --pygments-na: #E6EDF3; /* Name.Attribute */
        --pygments-nb: #E6EDF3; /* Name.Builtin */
        --pygments-nc: #F0883E; /* Name.Class */
        --pygments-no: #79C0FF; /* Name.Constant */
        --pygments-nd: #D2A8FF; /* Name.Decorator */
        --pygments-ni: #FFA657; /* Name.Entity */
        --pygments-ne: #F0883E; /* Name.Exception */
        --pygments-nf: #D2A8FF; /* Name.Function */
        --pygments-nl: #79C0FF; /* Name.Label */
        --pygments-nn: #FF7B72; /* Name.Namespace */
        --pygments-nx: #E6EDF3; /* Name.Other */
        --pygments-py: #79C0FF; /* Name.Property */
        --pygments-nt: #7EE787; /* Name.Tag */
        --pygments-nv: #79C0FF; /* Name.Variable */
        --pygments-ow: #FF7B72; /* Operator.Word */
        --pygments-pm: #E6EDF3; /* Punctuation.Marker */
        --pygments-w: #6E7681; /* Text.Whitespace */
        --pygments-mb: #A5D6FF; /* Literal.Number.Bin */
        --pygments-mf: #A5D6FF; /* Literal.Number.Float */
        --pygments-mh: #A5D6FF; /* Literal.Number.Hex */
        --pygments-mi: #A5D6FF; /* Literal.Number.Integer */
        --pygments-mo: #A5D6FF; /* Literal.Number.Oct */
        --pygments-sa: #79C0FF; /* Literal.String.Affix */
        --pygments-sb: #A5D6FF; /* Literal.String.Backtick */
        --pygments-sc: #A5D6FF; /* Literal.String.Char */
        --pygments-dl: #79C0FF; /* Literal.String.Delimiter */
        --pygments-sd: #A5D6FF; /* Literal.String.Doc */
        --pygments-s2: #A5D6FF; /* Literal.String.Double */
        --pygments-se: #79C0FF; /* Literal.String.Escape */
        --pygments-sh: #79C0FF; /* Literal.String.Heredoc */
        --pygments-si: #A5D6FF; /* Literal.String.Interpol */
        --pygments-sx: #A5D6FF; /* Literal.String.Other */
        --pygments-sr: #79C0FF; /* Literal.String.Regex */
        --pygments-s1: #A5D6FF; /* Literal.String.Single */
        --pygments-ss: #A5D6FF; /* Literal.String.Symbol */
        --pygments-bp: #E6EDF3; /* Name.Builtin.Pseudo */
        --pygments-fm: #D2A8FF; /* Name.Function.Magic */
        --pygments-vc: #79C0FF; /* Name.Variable.Class */
        --pygments-vg: #79C0FF; /* Name.Variable.Global */
        --pygments-vi: #79C0FF; /* Name.Variable.Instance */
        --pygments-vm: #79C0FF; /* Name.Variable.Magic */
        --pygments-il: #A5D6FF; /* Literal.Number.Integer.Long */
    }
}

html[data-theme="dark"] {
    --pygments-linenos: #6e7681;
    --pygments-linenos-bg: #0d1117;
    --pygments-linenos-special: #e6edf3;
    --pygments-linenos-special-bg: #6e7681;
    --pygments-hll-bg: #6e7681;
    --pygments-highlight-bg: #1a1a1a;
    --pygments-highlight: #E6EDF3;
    --pygments-c: #8B949E; /* Comment */
    --pygments-err: #F85149; /* Error */
    --pygments-esc: #E6EDF3; /* Escape */
    --pygments-g: #E6EDF3; /* Generic */
    --pygments-k: #FF7B72; /* Keyword */
    --pygments-l: #A5D6FF; /* Literal */
    --pygments-n: #E6EDF3; /* Name */
    --pygments-o: #FF7B72; /* Operator */
    --pygments-x: #E6EDF3; /* Other */
    --pygments-p: #E6EDF3; /* Punctuation */
    --pygments-ch: #8B949E; /* Comment.Hashbang */
    --pygments-cm: #8B949E; /* Comment.Multiline */
    --pygments-cp: #8B949E; /* Comment.Preproc */
    --pygments-cpf: #8B949E; /* Comment.PreprocFile */
    --pygments-c1: #8B949E; /* Comment.Single */
    --pygments-cs: #8B949E; /* Comment.Special */
    --pygments-gd: #FFA198; /* Generic.Deleted */
    --pygments-gd-bg: #490202;
    --pygments-ge: #E6EDF3; /* Generic.Emph */
    --pygments-ges: #E6EDF3; /* Generic.EmphStrong */
    --pygments-gr: #FFA198; /* Generic.Error */
    --pygments-gh: #79C0FF; /* Generic.Heading */
    --pygments-gi: #56D364; /* Generic.Inserted */
    --pygments-gi-bg: #0F5323;
    --pygments-go: #8B949E; /* Generic.Output */
    --pygments-gp: #8B949E; /* Generic.Prompt */
    --pygments-gs: #E6EDF3; /* Generic.Strong */
    --pygments-gu: #79C0FF; /* Generic.Subheading */
    --pygments-gt: #FF7B72; /* Generic.Traceback */
    --pygments-g-Underline: #E6EDF3; /* Generic.Underline */
    --pygments-kc: #79C0FF; /* Keyword.Constant */
    --pygments-kd: #FF7B72; /* Keyword.Declaration */
    --pygments-kn: #FF7B72; /* Keyword.Namespace */
    --pygments-kp: #79C0FF; /* Keyword.Pseudo */
    --pygments-kr: #FF7B72; /* Keyword.Reserved */
    --pygments-kt: #FF7B72; /* Keyword.Type */
    --pygments-ld: #79C0FF; /* Literal.Date */
    --pygments-m: #A5D6FF; /* Literal.Number */
    --pygments-s: #A5D6FF; /* Literal.String */
    --pygments-na: #E6EDF3; /* Name.Attribute */
    --pygments-nb: #E6EDF3; /* Name.Builtin */
    --pygments-nc: #F0883E; /* Name.Class */
    --pygments-no: #79C0FF; /* Name.Constant */
    --pygments-nd: #D2A8FF; /* Name.Decorator */
    --pygments-ni: #FFA657; /* Name.Entity */
    --pygments-ne: #F0883E; /* Name.Exception */
    --pygments-nf: #D2A8FF; /* Name.Function */
    --pygments-nl: #79C0FF; /* Name.Label */
    --pygments-nn: #FF7B72; /* Name.Namespace */
    --pygments-nx: #E6EDF3; /* Name.Other */
    --pygments-py: #79C0FF; /* Name.Property */
    --pygments-nt: #7EE787; /* Name.Tag */
    --pygments-nv: #79C0FF; /* Name.Variable */
    --pygments-ow: #FF7B72; /* Operator.Word */
    --pygments-pm: #E6EDF3; /* Punctuation.Marker */
    --pygments-w: #6E7681; /* Text.Whitespace */
    --pygments-mb: #A5D6FF; /* Literal.Number.Bin */
    --pygments-mf: #A5D6FF; /* Literal.Number.Float */
    --pygments-mh: #A5D6FF; /* Literal.Number.Hex */
    --pygments-mi: #A5D6FF; /* Literal.Number.Integer */
    --pygments-mo: #A5D6FF; /* Literal.Number.Oct */
    --pygments-sa: #79C0FF; /* Literal.String.Affix */
    --pygments-sb: #A5D6FF; /* Literal.String.Backtick */
    --pygments-sc: #A5D6FF; /* Literal.String.Char */
    --pygments-dl: #79C0FF; /* Literal.String.Delimiter */
    --pygments-sd: #A5D6FF; /* Literal.String.Doc */
    --pygments-s2: #A5D6FF; /* Literal.String.Double */
    --pygments-se: #79C0FF; /* Literal.String.Escape */
    --pygments-sh: #79C0FF; /* Literal.String.Heredoc */
    --pygments-si: #A5D6FF; /* Literal.String.Interpol */
    --pygments-sx: #A5D6FF; /* Literal.String.Other */
    --pygments-sr: #79C0FF; /* Literal.String.Regex */
    --pygments-s1: #A5D6FF; /* Literal.String.Single */
    --pygments-ss: #A5D6FF; /* Literal.String.Symbol */
    --pygments-bp: #E6EDF3; /* Name.Builtin.Pseudo */
    --pygments-fm: #D2A8FF; /* Name.Function.Magic */
    --pygments-vc: #79C0FF; /* Name.Variable.Class */
    --pygments-vg: #79C0FF; /* Name.Variable.Global */
    --pygments-vi: #79C0FF; /* Name.Variable.Instance */
    --pygments-vm: #79C0FF; /* Name.Variable.Magic */
    --pygments-il: #A5D6FF; /* Literal.Number.Integer.Long */
}

.comment pre {
    line-height: 125%;
}

.comment td.linenos .normal {
    color: var(--pygments-linenos);
    background-color: var(--pygments-linenos-bg);
    padding-left: 5px;
    padding-right: 5px;
}

.comment span.linenos {
    color: var(--pygments-linenos);
    background-color: var(--pygments-linenos-bg);
    padding-left: 5px;
    padding-right: 5px;
}

.comment td.linenos .special {
    color: var(--pygments-linenos-special);
    background-color: var(--pygments-linenos-special-bg);
    padding-left: 5px;
    padding-right: 5px;
}

.comment span.linenos.special {
    color: var(--pygments-linenos-special);
    background-color: var(--pygments-linenos-special-bg);
    padding-left: 5px;
    padding-right: 5px;
}

.comment .highlight .hll {
    background-color: var(--pygments-hll-bg);
}

.comment .highlight {
    background: var(--pygments-highlight-bg);
    color: var(--pygments-highlight);
}

.comment .highlight .c {
    color: var(--pygments-c);
    font-style: italic;
}

.comment .highlight .err {
    color: var(--pygments-err);
}

.comment .highlight .esc {
    color: var(--pygments-esc);
}

.comment .highlight .g {
    color: var(--pygments-g);
}

.comment .highlight .k {
    color: var(--pygments-k);
}

.comment .highlight .l {
    color: var(--pygments-l);
}

.comment .highlight .n {
    color: var(--pygments-n);
}

.comment .highlight .o {
    color: var(--pygments-o);
    font-weight: bold;
}

.comment .highlight .x {
    color: var(--pygments-x);
}

.comment .highlight .p {
    color: var(--pygments-p);
}

.comment .highlight .ch {
    color: var(--pygments-ch);
    font-style: italic;
}

.comment .highlight .cm {
    color: var(--pygments-cm);
    font-style: italic;
}

.comment .highlight .cp {
    color: var(--pygments-cp);
    font-weight: bold;
    font-style: italic;
}

.comment .highlight .cpf {
    color: var(--pygments-cpf);
    font-style: italic;
}

.comment .highlight .c1 {
    color: var(--pygments-c1);
    font-style: italic;
}

.comment .highlight .cs {
    color: var(--pygments-cs);
    font-style: italic;
    font-weight: bold;
}

.comment .highlight .gd {
    color: var(--pygments-gd);
    background-color: var(--pygments-gd-bg);
}

.comment .highlight .ge {
    font-style: italic;
    color: var(--pygments-ge);
}

.comment .highlight .ges {
    font-weight: bold;
    font-style: italic;
    color: var(--pygments-ges);
}

.comment .highlight .gr {
    color: var(--pygments-gr);
}

.comment .highlight .gh {
    color: var(--pygments-gh);
    font-weight: bold;
}

.comment .highlight .gi {
    color: var(--pygments-gi);
    background-color: var(--pygments-gi-bg);
}

.comment .highlight .go {
    color: var(--pygments-go);
}

.comment .highlight .gp {
    color: var(--pygments-gp);
}

.comment .highlight .gs {
    font-weight: bold;
    color: var(--pygments-gs);
}

.comment .highlight .gu {
    color: var(--pygments-gu);
}

.comment .highlight .gt {
    color: var(--pygments-gt);
}

.comment .highlight .g-Underline {
    color: var(--pygments-g-Underline);
    text-decoration: underline;
}

.comment .highlight .kc {
    color: var(--pygments-kc);
}

.comment .highlight .kd {
    color: var(--pygments-kd);
}

.comment .highlight .kn {
    color: var(--pygments-kn);
}

.comment .highlight .kp {
    color: var(--pygments-kp);
}

.comment .highlight .kr {
    color: var(--pygments-kr);
}

.comment .highlight .kt {
    color: var(--pygments-kt);
}

.comment .highlight .ld {
    color: var(--pygments-ld);
}

.comment .highlight .m {
    color: var(--pygments-m);
}

.comment .highlight .s {
    color: var(--pygments-s);
}

.comment .highlight .na {
    color: var(--pygments-na);
}

.comment .highlight .nb {
    color: var(--pygments-nb);
}

.comment .highlight .nc {
    color: var(--pygments-nc);
    font-weight: bold;
}

.comment .highlight .no {
    color: var(--pygments-no);
    font-weight: bold;
}

.comment .highlight .nd {
    color: var(--pygments-nd);
    font-weight: bold;
}

.comment .highlight .ni {
    color: var(--pygments-ni);
}

.comment .highlight .ne {
    color: var(--pygments-ne);
    font-weight: bold;
}

.comment .highlight .nf {
    color: var(--pygments-nf);
    font-weight: bold;
}

.comment .highlight .nl {
    color: var(--pygments-nl);
    font-weight: bold;
}

.comment .highlight .nn {
    color: var(--pygments-nn);
}

.comment .highlight .nx {
    color: var(--pygments-nx);
}

.comment .highlight .py {
    color: var(--pygments-py);
}

.comment .highlight .nt {
    color: var(--pygments-nt);
}

.comment .highlight .nv {
    color: var(--pygments-nv);
}

.comment .highlight .ow {
    color: var(--pygments-ow);
    font-weight: bold;
}

.comment .highlight .pm {
    color: var(--pygments-pm);
}

.comment .highlight .w {
    color: var(--pygments-w);
}

.comment .highlight .mb {
    color: var(--pygments-mb);
}

.comment .highlight .mf {
    color: var(--pygments-mf);
}

.comment .highlight .mh {
    color: var(--pygments-mh);
}

.comment .highlight .mi {
    color: var(--pygments-mi);
}

.comment .highlight .mo {
    color: var(--pygments-mo);
}

.comment .highlight .sa {
    color: var(--pygments-sa);
}

.comment .highlight .sb {
    color: var(--pygments-sb);
}

.comment .highlight .sc {
    color: var(--pygments-sc);
}

.comment .highlight .dl {
    color: var(--pygments-dl);
}

.comment .highlight .sd {
    color: var(--pygments-sd);
}

.comment .highlight .s2 {
    color: var(--pygments-s2);
}

.comment .highlight .se {
    color: var(--pygments-se);
}

.comment .highlight .sh {
    color: var(--pygments-sh);
}

.comment .highlight .si {
    color: var(--pygments-si);
}

.comment .highlight .sx {
    color: var(--pygments-sx);
}

.comment .highlight .sr {
    color: var(--pygments-sr);
}

.comment .highlight .s1 {
    color: var(--pygments-s1);
}

.comment .highlight .ss {
    color: var(--pygments-ss);
}

.comment .highlight .bp {
    color: var(--pygments-bp);
}

.comment .highlight .fm {
    color: var(--pygments-fm);
    font-weight: bold;
}

.comment .highlight .vc {
    color: var(--pygments-vc);
}

.comment .highlight .vg {
    color: var(--pygments-vg);
}

.comment .highlight .vi {
    color: var(--pygments-vi);
}

.comment .highlight .vm {
    color: var(--pygments-vm);
}

.comment .highlight .il {
    color: var(--pygments-il);
}