/*
  CUSTOM PRISM THEME
*/

// VARS

$very-light-gray: #b4a1d6;
$light-gray: #675a80;
$gray: #373b41;
$dark-gray: #181026;
$very-dark-gray: #201632;
$cyan: #74CAB4;
$blue: #31a7c9;
$purple: #7450b6;
$green: #DBD36E;
$red: #E2454B;
$orange: #db8958;
$light-orange: #ffb899;

// MAPPED VARS

$syntax-text-color: $very-light-gray;
$syntax-cursor-color: white;
$syntax-selection-color: lighten($dark-gray, 10%);
$syntax-background-color: $very-dark-gray;
$syntax-wrap-guide-color: $dark-gray;
$syntax-indent-guide-color: $gray;
$syntax-invisible-character-color: $gray;
$syntax-result-marker-color: $light-gray;
$syntax-result-marker-color-selected: white;
$syntax-gutter-text-color: $very-light-gray;
$syntax-gutter-text-color-selected: $syntax-gutter-text-color;
$syntax-gutter-background-color: $dark-gray;
$syntax-gutter-background-color-selected: $gray;
$syntax-color-renamed: $blue;
$syntax-color-added: $green;
$syntax-color-modified: $orange;
$syntax-color-removed: $red;

code[class*="language-"],
pre[class*="language-"] {
	color: $very-light-gray;
	font-family: Consolas, Monaco, 'Andale Mono', monospace;
	direction: ltr;
	text-align: left;
	white-space: pre;
	word-spacing: normal;
	word-break: normal;
	line-height: 1.5;

	-moz-tab-size: 4;
	-o-tab-size: 4;
	tab-size: 4;

	-webkit-hyphens: none;
	-moz-hyphens: none;
	-ms-hyphens: none;
	hyphens: none;
}
code[class*="language-css"],
pre[class*="language-css"] {
  color: $orange;
}

pre[class*="language-"]::-moz-selection, pre[class*="language-"] ::-moz-selection,
code[class*="language-"]::-moz-selection, code[class*="language-"] ::-moz-selection {
	text-shadow: none;
	background: $syntax-selection-color;
}

pre[class*="language-"]::selection, pre[class*="language-"] ::selection,
code[class*="language-"]::selection, code[class*="language-"] ::selection {
	text-shadow: none;
	background: $syntax-selection-color;
}

/* Code blocks */
pre[class*="language-"] {
	padding: 1em;
	margin: .5em 0;
	overflow: auto;
}

:not(pre) > code[class*="language-"],
pre[class*="language-"] {
	background: $syntax-background-color;
}

/* Inline code */
:not(pre) > code[class*="language-"] {
	padding: .1em;
	border-radius: .3em;
}

.token.comment,
.token.prolog,
.token.doctype,
.token.cdata {
	color: $light-gray;
}

.token {
  &.punctuation {
    color: $syntax-text-color;
    &.comment {
      color: #675a80;
    }
    &.string,
    &.variable,
    &.parameters,
    &.array {
      color: $syntax-text-color;
    }
    &.heading,
    &.identity {
      color: $blue;
    }

    &.important {
      color: $light-orange;
    }
  }
  &.operator {
    color: $syntax-text-color;
  }
  &.entity {
    color: $light-orange;
    text-decoration: underline;
  }
  &.function,
  &.keyword {
    color: $blue;
  }
  &.regexp,
  &.important {
    color: $cyan;
  }
  &.selector {
    color: $red;
    text-decoration: underline;
  }
  &.tag {
    color: $light-gray;
  }
  &.tag-id {
    color: $red;
  }
  &.attr-name {
    color: $orange;
  }
  &.attr-value {
    color: $green;
    
    .punctuation {
      color: $syntax-text-color;
    }
  }
  &.atrule {
    color: $cyan;
    
    .atrule-id {
      color: $purple;
    }
    .punctuation {
      color: $syntax-text-color;
    }
  }
  &.string,
  &.char,
  &.builtin,
  &.url {
    color: $green;
  }
  &.pseudo-class {
    color: $orange;
  }
  &.boolean,
  &.number,
  &.constant {
    color: $orange;
  }
  &.symbol {
    color: $green;
  }
  &.property {
    color: $syntax-text-color;
  }
  &.important {
    font-weight: bold;
  }
  &.entity {
    cursor: help;
  }
}

.namespace {
	opacity: .7;
}

.token.char {
  color: red;
}

/*
  GENERAL "MEH" STYLES
*/

body {
  margin: 0;
  background-color: #444444;
  padding: 40px;
}
.wrapper {  
  &:after {
    content: "";
    display: table;
    clear: both;
  }
}
.col pre {
  max-height: 250px;
}
h2 {
  color: #CCCCCC;
  text-shadow: 0 1px 2px rgba(0,0,0, .2);
}