/******************************************************************************/
/*                                                                            */
/* rexx-dark.css - Sample CSS for Rexx highlighting, dark background          */
/* =================================================================          */
/*                                                                            */
/* This program is part of the Rexx Parser package                            */
/* [See https://rexx.epbcn.com/rexx-parser/]                                  */
/*                                                                            */
/* Copyright (c) 2024-2026 Josep Maria Blasco <josep.maria.blasco@epbcn.com>  */
/*                                                                            */
/* License: Apache License 2.0 (https://www.apache.org/licenses/LICENSE-2.0)  */
/*                                                                            */
/* Version history:                                                           */
/*                                                                            */
/* Date     Version Details                                                   */
/* -------- ------- --------------------------------------------------------- */
/* 20241206    0.1  First public release                                      */
/* 20241209    0.1b New call system                                           */
/* 20241222    0.1c Line number support                                       */
/* 20250103    0.1e Add TUTOR-flavored Unicode classes                        */
/* 20250116    0.1f Add support for sub-keywords                              */
/* 20250328    0.2  Main dir is now rexx-parser instead of rexx[.]parser      */
/* 20250406         Rename fractional numbers to decimal                      */
/* 20250530    0.2c Add support for detailed string highlighting              */
/* 20250624    0.2d Complete refactor to use nesting and "&"                  */
/* 20250630         Add support for doc-comment subelements                   */
/* 20250722         Add styles for rx-dskw                                    */
/* 20251109         use rexx-dark as template for vim colorschemes            */
/*                                                                            */
/******************************************************************************/

/******************************************************************************/
/******************************************************************************/
/* BASE SELECTOR: highlight-%STYLENAME% */
/******************************************************************************/
/******************************************************************************/
/*   Format: "highlight-%STYLENAME%                                           */
/*   It will apply to the whole CSS file                                      */
/******************************************************************************/

.highlight-%STYLENAME% {

/******************************************************************************/
/* Default settings                                                           */
/* ================                                                           */
/*                                                                            */
/*   The "rexx" class is used as a fallback when no suitable class is found   */
/*                                                                            */
/******************************************************************************/

  pre, .rexx {
    %NORMAL%            /* vim: background and foreground */
  }

/******************************************************************************/
/* Support for line numbers                                                   */
/* ========================                                                   */
/******************************************************************************/

  .rx-lineno  {                         /* ANSI Driver only                   */
    %LINENR%
  }
  .rx-linebar {                         /* ANSI Driver only                   */
    %LINENR%
  }

  /* Line numbering. The number hangs OUTSIDE the code ground, in a gutter of  */
  /* its own, with a continuous rule between gutter and code -- the same       */
  /* result Pandoc gets for its fenced blocks, reached by the same technique.  */
  /* The technique is borrowed; the class names are NOT. Pandoc scopes its     */
  /* rules by ITS names (.sourceCode, .numberSource), so a block wearing them  */
  /* would take its margins, overflow, line-height and background from a sheet */
  /* we do not control -- a dependency that would surface as a bug nobody      */
  /* could trace. Everything below is keyed to rx- names and stated in full.   */
  /*                                                                           */
  /* How it works. The <pre> is pushed 3em right and given a left border: that */
  /* opens a gutter outside the code ground, and the border IS the vertical    */
  /* rule. Each line is a <span> shifted 4em left by relative positioning      */
  /* (visual only -- the box does not move), and the number is an inline-block */
  /* 4em cell in front of the line, which pushes the code back to where it     */
  /* belongs. Net effect: code where the <pre> says, number in the gutter.     */
  /* The number is generated content on the line's anchor, counted by CSS, so  */
  /* it is never selected or copied along with the code.                       */
  /*                                                                           */
  /* The 4em cell holds five digits at any font size, so the gutter does not   */
  /* need to vary with rx-w<n>; a block that needs more can widen it there.    */
  /* The scrolling box has to be the WRAPPER, not the <pre>. A <pre> with      */
  /* overflow-x:auto (markdown.css sets exactly that, and it is a sane default */
  /* for code) is a scroll container, and anything a scroll container's        */
  /* content sticks out to the LEFT is clipped and cannot be scrolled to. The  */
  /* gutter lives precisely there, so a numbered <pre> is given back           */
  /* overflow:visible and the wrapper takes over the horizontal scrolling.     */
  &.rx-blockwrap { overflow-x: auto; }

  pre.rx-numbered {
    overflow: visible;
    margin-left: 3em;
    /* The gutter's two colours come from theme variables, each with the
       discreet grey as fallback. A theme that says nothing gets the grey;
       a theme that wants, say, a bold blue rule sets --rx-gutter-bar once
       on its .highlight-rexx-<name> and never touches this block.         */
    border-left: 1px solid var(--rx-gutter-bar, #b0b0a8);   /* the vertical bar */
    padding-left: 4px;

    code { counter-reset: rx-line 0; }

    code > span {
      position: relative;
      left: -4em;
      counter-increment: rx-line;
    }

    code > span > a:first-child::before {
      content: counter(rx-line);
      position: relative;
      left: -1em;
      /* The cell's OUTER width must not depend on the host page. Pandoc's cell
         is 4em wide with 4px of padding inside it -- but whether that padding
         counts inside or outside depends on whether the page carries a global
         border-box reset, which we do not control. Stating the outer width
         and putting the gap in margin-right instead makes the geometry the
         same in every host: 4em of cell, then a fixed 4px gap to the rule.  */
      width: 4em;
      padding: 0;
      margin-right: 4px;
      display: inline-block;
      text-align: right;
      /* A host page that justifies its text sets text-align-last, which is
         INHERITED and wins over text-align on a last line -- and a one-line
         number is always a last line. Stated here so the digits cannot be
         pushed to the far end of the cell by a stylesheet we do not own.   */
      text-align-last: right;
      /* box-sizing is stated, not inherited: a host page may or may not carry
         a global border-box reset (Bootstrap has one), and the cell's outer
         width has to be the same either way. border-box is the value that
         makes the cell 4em INCLUDING its padding -- which is what a Pandoc
         block ends up with under such a reset, so the two line up.         */
      box-sizing: border-box;
      vertical-align: baseline;
      border: none;
      color: var(--rx-gutter-number, #b0b0a8);
      /* keep the number out of text selection / copy */
      -webkit-user-select: none;
      user-select: none;
    }
  }

/******************************************************************************/
/* Whitespace and continuations                                               */
/* ============================                                               */
/******************************************************************************/

  /* .rx-ws, .rx-cont { color: #cc0; } */
  .rx-cont { %WILDMENU% }

/******************************************************************************/
/* Standard (non-doc) comments                                                */
/* ===========================                                                */
/******************************************************************************/

  .rx-cm,                               /* Classic, block comments            */
  .rx-lncm {                            /* Line comments                      */
    %COMMENT%
  }

/******************************************************************************/
/* Doc-comments                                                               */
/* ============                                                               */
/******************************************************************************/

  .rx-doc-comment,                      /* Classic style doc-comments         */
  .rx-doc-comment-markdown {            /* Markdown style doc-comments        */

                                        /* Default values (for "block"..      */
                                        /* ..highlighting.                    */
    %COMMENT%

    &.rx-doc-comment-armature,          /* Armature, whitespace and main      */
    &.rx-doc-comment-whitespace,        /* description share the same style.  */
    &.rx-doc-comment-main-description {
        %COMMENT%
    }
    &.rx-doc-comment-summary {          /* Initial summary statement.         */
        %COMMENT%
    }
    &.rx-doc-comment-tag {              /* @block-tag                         */
        %COMMENT%
    }
    &.rx-doc-comment-tag-value {        /* As the name in "@param name".      */
        %COMMENT%
    }
    &.rx-doc-comment-tag-description {  /* Text after @deprecated.            */
        %COMMENT%
    }
  }

/******************************************************************************/
/* Shebangs                                                                   */
/* ========                                                                   */
/******************************************************************************/

  .rx-shb { %SPECIAL% }

/******************************************************************************/
/* Keywords and subkeywords, assignment sequences, and "::"                   */
/* ========================================================                   */
/******************************************************************************/

  .rx-kw,                               /* Keywords                           */
  .rx-skw,                              /* Subkeywords                        */
  .rx-asg                               /* Assignment sequences (incl. "=")   */
  {
    %STATEMENT% /* %_KEYWORD_% */
  }

  .rx-dkw,                              /* Directive keywords                 */
  .rx-dskw,                             /* Directive subkeywords              */
  .rx-dir                               /* The directive start "::" sequence  */
  {
    %PREPROC% /* %_TYPE_% */
  }

  /* Additionally, directive keywords and subkeywords are underlined          */

  .rx-dkw, .rx-dskw { %NONE% }

/******************************************************************************/
/* Strings (including taken constants that are strings)                       */
/* ====================================================                       */
/******************************************************************************/

  .rx-str , .rx-bstr, .rx-xstr,         /* Classic Rexx strings               */
  .rx-ystr, .rx-pstr, .rx-gstr, .rx-tstr, .rx-ustr { /* TUTOR Unicode strings */
    %STRING%                            /* the inner part of the string       */
    &.rx-ssuf            { %STRING% }   /* String suffix                      */
    &.rx-oquo, &.rx-cquo { %STRING% }   /* Quotes                             */
  }

  /* Taken constants that are strings                                         */

  .rx-const {
    &.rx-ssuf            { %SPECIAL% /* %_STRING_% */ }   /* String suffix                      */
    &.rx-oquo, &.rx-cquo { %SPECIAL% /* %_STRING_% */ }   /* Quotes                             */
  }

/******************************************************************************/
/* Numbers                                                                    */
/* =======                                                                    */
/******************************************************************************/

  /*--------------------------------------------------------------------------*/
  /* Simple highlighting classes (not used by the highlighter)                */
  /*--------------------------------------------------------------------------*/

  .rx-int,                              /* Integers                           */
  .rx-deci,                             /* Decimals (w/ a dot, no exponent)   */
  .rx-exp {                             /* Exponentials (w/ or w/o a dot)     */
    %NUMBER%
  }

  /*--------------------------------------------------------------------------*/
  /* Detailed highlighting (includes non X and B strings that are numbers)    */
  /*--------------------------------------------------------------------------*/

  .rx-nsign { %NUMBER% }                /* Number sign (for strings only)     */


  .rx-ipart,                            /* Integer part                       */
  .rx-fpart,                            /* Fractional part                    */
  .rx-expon                             /* The exponent itself                */
  {
    %NUMBER%
  }

  .rx-dpoint { %NUMBER% }        /* The decimal point                  */
  .rx-emark  { %NUMBER% }        /* The exponent mark ("E" or "e")     */
  .rx-esign  { %NUMBER% }        /* The (optional) exponent sign       */

/******************************************************************************/
/* Variables and constant symbols                                             */
/* ==============================                                             */
/******************************************************************************/

  /* Set a common color for all variables                                     */
  .rx-var, .rx-xvar, .rx-stem, .rx-xstem, .rx-cmp, .rx-xcmp { %IDENTIFIER% }

  /* Additionally, exposed variables will be italicized                       */
  .rx-xvar, .rx-xstem, .rx-xcmp { %IDENTIFIER% }

  /* Environment symbols                                                      */
  .rx-env { %PREPROC% /* %_NONTEXT_% */ }

  /* Const symbols that are not environment symbols                           */
  .rx-lit { %SPECIAL% /* %_NONTEXT_% */ }

/******************************************************************************/
/* Special characters and operators                                           */
/* ================================                                           */
/******************************************************************************/

  .rx-spe, .rx-op { %OPERATOR% }

/******************************************************************************/
/* Taken constants                                                            */
/* ===============                                                            */
/*                                                                            */
/*   I.e., tokens that are "strings or symbols taken as a constant".          */
/*   In the case of strings, quotes and suffixes are assignes styles under    */
/*   "strings".                                                               */
/******************************************************************************/

  .rx-const {

    /*------------------------------------------------------------------------*/
    /* Default highlighting                                                   */
    /*------------------------------------------------------------------------*/

    %STATEMENT%

    /*------------------------------------------------------------------------*/
    /* Built-in functions and procedures                                      */
    /*------------------------------------------------------------------------*/

    &.rx-bif-func, &.rx-bif-proc {
      %FUNCTION%                        /* Color (symbols and strings)        */
      &.rx-ssuf { %STRING%   }          /* Suffix (for strings)               */
      &.rx-oquo,                        /* Quotes (for strings)               */
      &.rx-cquo { %STRING%   }
    }

    /*------------------------------------------------------------------------*/
    /* Internal functions and procedures, labels and block instruction names  */
    /*------------------------------------------------------------------------*/

    &.rx-int-func, &.rx-int-proc, &.rx-block, &.rx-label {
      %FUNCTION%                        /* Color (symbols and strings)        */
      &.rx-ssuf { %STRING% }            /* Suffix (for strings)               */
      &.rx-oquo,                        /* Quotes (for strings)               */
      &.rx-cquo { %STRING% }
    }

    /*------------------------------------------------------------------------*/
    /* ::ROUTINE names, ::ROUTINE function and procedure calls,               */
    /* and namespace-qualified ::ROUTINEs                                     */
    /*------------------------------------------------------------------------*/

    &.rx-routine, &.rx-pkg-func, &.rx-pkg-proc, &.rx-ext-pkg-func,
    &.rx-ext-pkg-proc {
      %FUNCTION%                        /* Color (symbols and strings)        */
      &.rx-ssuf { %STRING% }            /* Suffix (for strings)               */
      &.rx-oquo,                        /* Quotes (for strings)               */
      &.rx-cquo { %STRING% }
    }

    /*------------------------------------------------------------------------*/
    /* External calls                                                         */
    /*------------------------------------------------------------------------*/

    &.rx-ext-func, &.rx-ext-proc {
      %FUNCTION%                        /* Color (symbols and strings)        */
                                        /* Italic (symbols and strings)       */
      &.rx-ssuf { %STRING% }            /* Suffix (for strings)               */
      &.rx-oquo,                        /* Quotes (for strings)               */
      &.rx-cquo { %STRING% }
    }

    /*------------------------------------------------------------------------*/
    /* Method names                                                           */
    /*------------------------------------------------------------------------*/

    &.rx-method {
      %TAG%                             /* Color (symbols and strings)        */
                                        /* Italic (symbols and strings)       */
      &.rx-ssuf { %STRING% }            /* Suffix (for strings)               */
      &.rx-oquo,                        /* Quotes (for strings)               */
      &.rx-cquo { %STRING% }
    }

    /*------------------------------------------------------------------------*/
    /* Namespace names                                                        */
    /*------------------------------------------------------------------------*/

    &.rx-namespace {
      %STATUSLINE%                      /* Color (symbols and strings)        */
      &.rx-ssuf { %STRING% }            /* Suffix (for strings)               */
      &.rx-oquo,                        /* Quotes (for strings)               */
      &.rx-cquo { %STRING% }
    }

    /*------------------------------------------------------------------------*/
    /* Resources                                                              */
    /*------------------------------------------------------------------------*/

    /* Resource name                                                          */
    &.rx-resource {
      %PREPROC%                         /* Color (symbols and strings)        */
      &.rx-ssuf { %STRING% }            /* Suffix (for strings)               */
      &.rx-oquo,                        /* Quotes (for strings)               */
      &.rx-cquo { %STRING% }
    }

    /* Resource delimiter                                                     */
    &.rx-res-delimiter {
      %PREPROC%
    }

  } /* <-- END OF .rx-const                                                   */

/******************************************************************************/
/* ::RESOURCE data and ignored stuff                                          */
/******************************************************************************/

  /* Resource data                                                            */
  .rx-res-data {
   %STRING%
  }

  /* Resource ignored stuff                                                   */
  .rx-res-ignore {
   %COMMENT%
  }

/******************************************************************************/
/******************************************************************************/
/* END highlight-rexx-dark                                                    */
/******************************************************************************/
/******************************************************************************/

} /* <--- END OF highlight-%STYLENAME%                                        */

/******************************************************************************/
/******************************************************************************/
/* END OF BASE SELECTOR highlight-rexx-dark                                   */
/******************************************************************************/
/******************************************************************************/

/******************************************************************************/
/******************************************************************************/

/******************************************************************************/
/* Visible blanks (blanks= / {.blanks})                                       */
/*                                                                            */
/* One open box per blank, DRAWN rather than typed: U+2423 is not in every    */
/* typeface -- IBM Plex has no glyph for it at any subset -- and a missing    */
/* glyph in a monospaced listing does not merely look wrong, it shifts the    */
/* column and makes the reader count something that is not there. Three       */
/* gradients tile at one character cell, so a run of three blanks draws three */
/* boxes from a single span, and the real blanks stay in the text: the        */
/* listing can still be copied out of the page and run.                       */
/*                                                                            */
/* The ink follows the element the blank belongs to (a blank inside a string  */
/* is the string's colour); a theme that wants its own sets --rx-blank-ink.   */
/* The proportions come from the real glyph: ink across 12%..87% of the cell, */
/* a bar .07em thick and ticks .3em tall, all sitting low, below the baseline */
/* as U+2423 does.                                                            */
/******************************************************************************/

.highlight-%STYLENAME% .rx-blank-mark {
  background-image:
    linear-gradient(to right, transparent 12%, var(--rx-blank-ink, currentColor) 12%,
                    var(--rx-blank-ink, currentColor) 87%, transparent 87%),
    linear-gradient(to right, transparent 12%, var(--rx-blank-ink, currentColor) 12%,
                    var(--rx-blank-ink, currentColor) 23%, transparent 23%),
    linear-gradient(to right, transparent 76%, var(--rx-blank-ink, currentColor) 76%,
                    var(--rx-blank-ink, currentColor) 87%, transparent 87%);
  /* All three layers hang from the BOTTOM of the inline box -- the descent
     line -- and never from a measured baseline: how tall that box is depends
     on the font in use (1.31em in one, 1.18em in another), and an em-based
     offset that fits one font puts the bar outside the box in the next, where
     the browser clips it away without a word. Anchored at 100% the mark sits
     right, whatever the listing is set in. */
  background-size: 1ch .07em, 1ch .3em, 1ch .3em;
  background-position: 0 100%, 0 100%, 0 100%;
  background-repeat: repeat-x;
}
.highlight-%STYLENAME% .rx-tab-mark {
  /* A tab, drawn as editors draw it: an arrow running into a wall, --->|, the
     wall being the tab stop. Drawn once however wide the tab is -- not the
     blank's box, because a tab is not a blank and is not one cell wide.
     Four layers: the shaft, the two strokes of the arrowhead, and the wall.
     A stroke is the diagonal of its own small box: with a corner keyword,
     the 50% line of a gradient runs through the other two corners. */
  background-image:
    linear-gradient(var(--rx-blank-ink, currentColor), var(--rx-blank-ink, currentColor)),
    linear-gradient(to top right, transparent 42%, var(--rx-blank-ink, currentColor) 42%, var(--rx-blank-ink, currentColor) 58%, transparent 58%),
    linear-gradient(to bottom right, transparent 42%, var(--rx-blank-ink, currentColor) 42%, var(--rx-blank-ink, currentColor) 58%, transparent 58%),
    linear-gradient(var(--rx-blank-ink, currentColor), var(--rx-blank-ink, currentColor));
  background-size: calc(100% - .45ch) .07em, .28em .2em, .28em .2em, .07em .5em;
  background-position: left .1ch bottom .25em, right .3ch bottom .285em,
                       right .3ch bottom .085em, right .2ch bottom .03em;
  background-repeat: no-repeat;
}