/*  PmSyntax: Syntax highlighting for PmWiki markup
    Copyright 2021-2024 Petko Yotov https://www.pmwiki.org/support
    This file is part of PmWiki; you can redistribute it and/or modify
    it under the terms of the GNU General Public License as published
    by the Free Software Foundation; either version 2 of the License, or
    (at your option) any later version.  See pmwiki.php for full details.

    This file provides a color theme for syntax highlighting of PmWiki markup,
    to be used in the PmWiki documentation, and optionally in the edit form.

    The CSS variables can be redefined in skins and in local customization in 
    order to adapt to other color themes.
*/
:root {
  /* base text color and background */
  --pmsyntax-color: inherit;
  --pmsyntax-bgcolor: inherit;

  /* [=Escaped text=], not processed by PmWiki */
  --pmsyntax-escaped: rgba(0,0,0,.7);
  --pmsyntax-escapedbg: rgba(0,0,0,.07);

  /* (:comment text:)*/
  --pmsyntax-comment: #777;

  /* core meta directives and wikistyles */
  --pmsyntax-meta: #279;
  --pmsyntax-metabg: #eff;

  /* other core and custom directives */
  --pmsyntax-directive: #000000;
  --pmsyntax-directivebg: #eee;

  /* markup expressions */
  --pmsyntax-mx: #470;
  --pmsyntax-mxbg: #efe;

  /* !! Headings */
  --pmsyntax-heading: #800;
  --pmsyntax-headingbg: #ffe7e1;

  /* list items, line breaks, indents */
  --pmsyntax-bullet: #470;
  --pmsyntax-bulletbg: #dfd;

  /* simple tables */
  --pmsyntax-table: #470;
  --pmsyntax-tablebg: #dfd;

  /* inline punctuation like '''bold''' */
  --pmsyntax-punct: #a00;

  /* i18n strings like $[Edit] or entities like   */
  --pmsyntax-string: #800;

  /* attributes and values in directives and wikistyles */
  --pmsyntax-attr: #f70;
  --pmsyntax-value: #a00;

  /* page (text) variables, template variables, like {*$:Summary} */
  --pmsyntax-var: #f40;
  
  /* keyword in forms, templates, conditionals */
  --pmsyntax-keyword: #a0a;


  /* Link URLs, InterMap links */
  --pmsyntax-url: #37a;

  /* textarea of the edit form, and highlighted block under it */
  --pmsyntax-border: 1px inset #ccc;
  --pmsyntax-radpad: 3px;
  --pmsyntax-fontfamily: monospace;

  --pmsyntax-fontsize: .93333em;
  --pmsyntax-fontsize-editform: 14px;
  --pmsyntax-lineheight: 1.3;

  /* color of the blinking cursor in the textarea */
  --pmsyntax-caretcolor: #f00;
}

@media screen {
  html.pmDarkTheme {
  /* base text color and background */
    --pmsyntax-color: inherit;
    --pmsyntax-bgcolor: inherit;

    /* [=Escaped text=], not processed by PmWiki */
    --pmsyntax-escaped: rgba(255, 255, 255, .7);
    --pmsyntax-escapedbg: rgba(255, 255, 255, .07);

    /* (:comment text:)*/
    --pmsyntax-comment: #a6a6a6;

    /* core meta directives and wikistyles */
    --pmsyntax-meta: #6db6db;
    --pmsyntax-metabg: #0e1b1b;

    /* other core and custom directives */
    --pmsyntax-directive: #ddd;
    --pmsyntax-directivebg: #222;

    /* markup expressions */
    --pmsyntax-mx: #8dc051;
    --pmsyntax-mxbg: #0f2b13;

    /* !! Headings */
    --pmsyntax-heading: #ffa888;
    --pmsyntax-headingbg: #43322d;

    /* list items, line breaks, indents */
    --pmsyntax-bullet: #8dc051;
    --pmsyntax-bulletbg: #0f2b13;

    /* simple tables */
    --pmsyntax-table: #8dc051;
    --pmsyntax-tablebg: #0f2b13;

    /* inline punctuation like '''bold''' */
    --pmsyntax-punct: #ff906b;

    /* i18n strings like $[Edit] or entities like   */
    --pmsyntax-string: #ffa888;

    /* attributes and values in directives and wikistyles */
    --pmsyntax-attr: #e05e00;
    --pmsyntax-value: #ff906b;

    /* page (text) variables, template variables, like {*$:Summary} */
    --pmsyntax-var: #ff5415;
    
    /* keyword in forms, templates, conditionals */
    --pmsyntax-keyword: #f8f;


    /* Link URLs, InterMap links */
    --pmsyntax-url: #74b0e7;

    /* textarea of the edit form, and highlighted block under it */
    --pmsyntax-border: 1px inset #5c5c5c;
    --pmsyntax-radpad: 3px;
    --pmsyntax-fontfamily: monospace;

    --pmsyntax-fontsize: .93333em;
    --pmsyntax-fontsize-editform: 14px;
    --pmsyntax-lineheight: 1.3;

    /* color of the blinking cursor in the textarea */
    --pmsyntax-caretcolor: #ff4727;
  }
}


table.markup td.markup1, pre.pmhlt, .pmhlt pre, 
code.pmhlt, .pmhlt code, .htext.pmhlt {
  color: var(--pmsyntax-color);
  background-color: var(--pmsyntax-bgcolor);
  font-family: var(--pmsyntax-fontfamily);
  font-size: var(--pmsyntax-fontsize);
}
.htext.pmhlt, .htext.pmhlt code, .htext.pmhlt code.hljs {
  font-size: var(--pmsyntax-fontsize-editform);  
}
.pmhlt .pmtag, .pmhlt .pmpunct {
  font-weight: bold;
}
.pmhlt .pmcomment {
  color: var(--pmsyntax-comment);
}
.pmhlt .pmmx {
  color: var(--pmsyntax-mx);
  background-color: var(--pmsyntax-mxbg);
}
.pmhlt .pmdirective {
  color: var(--pmsyntax-directive);
  background-color: var(--pmsyntax-directivebg);
}
.pmhlt .pmstring {
  color: var(--pmsyntax-string);
}
.pmhlt .pmvar {
  color: var(--pmsyntax-var);
}
.pmhlt .pmmeta {
  color: var(--pmsyntax-meta);
  background-color: var(--pmsyntax-metabg);
}
.pmhlt .pmbullet {
  color: var(--pmsyntax-bullet);
  background-color: var(--pmsyntax-bulletbg);
}
.pmhlt .pmtable {
  color: var(--pmsyntax-table);
  background-color: var(--pmsyntax-tablebg);
}
.pmhlt .pmpunct {
  color: var(--pmsyntax-punct);
}
.pmhlt .pmurl{
  color: var(--pmsyntax-url);
}
.pmhlt .pmheading {
  background-color: var(--pmsyntax-headingbg);
}
.pmhlt .pmheading .pmtag:not(.pmcomment,.pmcomment>*,.pmescaped,.pmescaped>*,.pmdirective,.pmdirective>*,.pmmeta,.pmmeta>*,.pmmx,.pmmx>*),
.pmhlt .pmheading.pmtag {
  color: var(--pmsyntax-heading);
}
.pmhlt .pmescaped {
  color: var(--pmsyntax-escaped);
  background-color: var(--pmsyntax-escapedbg);
}
.pmhlt .pmattr {
  color: var(--pmsyntax-attr);
}
.pmhlt .pmkeyword {
  color: var(--pmsyntax-keyword);
  font-style: italic;
}
.pmhlt .pmvalue {
  color: var(--pmsyntax-value);
}
.pmhlt .pmnobg {
  background-color: transparent;
}

.pmhlt code.hljs {
  padding: 0;
  display: inline;
}

.hwrap {
  position: relative;
  border: none;
  padding: 0;
  margin: 0;
  width: 100%;
  display: inline-block; /*skins*/
/*   z-index:-1; */
}
.hwrap textarea, .htext {
  border: var(--pmsyntax-border);
  border-radius: var(--pmsyntax-radpad);
  padding: var(--pmsyntax-radpad);
  box-sizing: border-box;
  font-family: var(--pmsyntax-fontfamily);
  font-size: var(--pmsyntax-fontsize-editform);
  line-height: var(--pmsyntax-lineheight);
/*   background-color: transparent; */
  width: 100%;
  max-width: 100%;
  margin: 0;
  word-wrap: break-word;
  overflow-wrap: break-word;
}
.hwrap textarea.hot {
  color: transparent;
  background-color: transparent;
  position: relative;
  background-image: none;
  caret-color: var(--pmsyntax-caretcolor);
/*   z-index: 0; */
}

.htext * {
  line-height: var(--pmsyntax-lineheight);
}
.hwrap textarea {
  position: relative;
  z-index:1;
}
.hwrap .htext {
  display: none;
  position: absolute;
  top: 0px;
  left: 0px;
  background-color: var(--pmsyntax-bgcolor);
  white-space: pre-wrap;
  border-color: transparent;
  overflow: auto;
  user-select: none;
  z-index:0;
}

textarea.pmsyntax.hot + .htext {
  display: block;
}
.chk_hlt {
  float: right;
  font-size: var(--pmsyntax-fontsize);;
  cursor: pointer;
  user-select: none;
  position: relative;
/*   z-index: 1; */
  font-family: var(--pmsyntax-fontfamily);
}


/* For $EnableUploadDrop, we reuse colors that are 
 * likely to be appropriate regardless of the skin. */
.pmdropzone {
  border-style: dashed;
  border-width: 2px;
  margin-bottom: .25rem;
}
.pmdropzone.over {
  background-color: var(--pmsyntax-bulletbg);
}
.pmdropzone a {
  margin-right: .5em;
  display: inline-block;
  text-decoration: none;
}
.pmdropzone a::before {
  margin-right: .25em;
}
.pmdropzone a.queued {
  color: var(--pmsyntax-attr);
  opacity: .5;
  cursor: wait;
}
.pmdropzone a.uploading {
  color: var(--pmsyntax-attr);
  cursor: wait;
}
.pmdropzone a.error {
  color: var(--pmsyntax-string);
}
.pmdropzone a.deleting {
  opacity: 0.1;
  transition: opacity 0.7s linear;
}
.pmdropzone a.error:hover {
  text-decoration: line-through;
}
.pmdropzone a.queued::before {
  content: "\23F8";
}
.pmdropzone a.uploading::before {
  content: "\25B2";
  animation: blnk .6s infinite;
}
@keyframes blnk { 50% { opacity: 0; } }
.pmdropzone a.success::before {
  content: "\25A0";
}
.pmdropzone a.error::before {
  content: "\2326";
}

@media print {
  .pmdropzone {
    display: none;
  }
}