/* cgit stylesheet - symlinx dark theme
 *
 * To retheme: edit the palette below. Nothing outside :root has a raw color.
 * blue = interaction (links, controls)   gold = structure (titles, headers, hashes)
 *
 * Sections, in order:
 *   1  palette          7  blob / blame        13  ref decorations
 *   2  page basics      8  commit view         14  stats + graphs
 *   3  links            9  diffstat            15  ages
 *   4  forms + buttons  10 unified diff        16  pager + footer
 *   5  header + tabs    11 side-by-side diff   17  syntax highlighting
 *   6  lists            12 misc bits
 */


/* ==========================================================================
   1. PALETTE
   ========================================================================== */

:root {
	/* surfaces */
	--bg:          #0f0f0f;   /* page, odd rows */
	--bg-alt:      #0f0f0f;   /* even rows, inputs, small panels */
	--bg-raised:   #141414;   /* path bar, active tab, table headers */
	--bg-hover:    #16232c;   /* row hover */
	--border:      #2a2a2a;   /* neutral hairline */

	/* text */
	--fg:          #ffffff;
	--fg-muted:    #b0b0b0;
	--fg-dim:      #808080;
	--fg-faint:    #6e6e6e;

	/* blue - interaction */
	--blue:        #327bab;   /* links */
	--blue-light:  #5aa3d0;   /* link hover, hunk headers */
	--blue-dark:   #1f4a68;   /* borders */
	--blue-faint:  #12293a;   /* backgrounds */

	/* gold - structure */
	--gold:        #dab986;   /* titles, headers, hashes */
	--gold-dim:    #a8905f;
	--gold-dark:   #6b5636;   /* borders */
	--gold-faint:  #241d12;   /* backgrounds */

	/* green - additions */
	--green:        #7fc97f;  /* text */
	--green-dim:    #5f9e6f;
	--green-dark:   #2f5f38;  /* borders */
	--green-faint:  #0f2416;  /* lightest background */
	--green-mid:    #16361f;
	--green-strong: #1d4a28;  /* intra-line highlight */

	/* red - deletions */
	--red:          #e06c75;  /* text */
	--red-dark:     #6b2f34;  /* borders */
	--red-faint:    #2a1113;  /* lightest background */
	--red-mid:      #3a181b;
	--red-strong:   #4a1f23;  /* intra-line highlight */

	/* changed lines (side-by-side diff) */
	--changed-faint: #2a2413;
	--changed-mid:   #3a331a;

	/* extra hues - commit graph + syntax highlighting only */
	--purple:      #c678dd;
	--cyan:        #56b6c2;
	--orange:      #d1a05a;
	--comment:     #7a8590;
}


/* ==========================================================================
   2. PAGE BASICS
   ========================================================================== */

html,
body {
	background: var(--bg);
	color: var(--fg);
}

body {
	/* 12px = the browser's default 8px body margin + cgit's old 4px padding */
	margin: 0;
	padding: 12px;
	font-family: "IBM Plex Mono", monospace;
	font-size: 16pt;
}

table {
	border-collapse: collapse;
}

img {
	border: none;
}

div.error {
	color: var(--red);
	font-weight: bold;
	margin: 1em 2em;
}

.left  { text-align: left; }
.right { text-align: right; }


/* ==========================================================================
   3. LINKS
   ========================================================================== */

a {
	color: var(--blue);
	text-decoration: none;
}

a:hover {
	color: var(--blue-light);
	text-decoration: none;
}


/* ==========================================================================
   4. FORMS + BUTTONS
   ========================================================================== */

input,
select,
textarea {
	color: var(--fg);
	background-color: var(--bg-raised);
	border: solid 2px var(--gold-dark);
	padding: 2px 5px;
}

input:focus,
select:focus,
textarea:focus {
	border-color: var(--gold);
	outline: none;
}

input[type="submit"] {
	color: var(--gold-dim);
	cursor: pointer;
	border: solid 0px;
}

input[type="submit"]:hover {
	color: var(--gold);
	border-color: var(--gold-dark);
	border: none;
}

input#switch-btn {
	margin: 2px 0px 0px 0px;
}

td#sidebar input.txt {
	width: 100%;
	margin: 2px 0px 0px 0px;
}

a.button {
	font-size: 80%;
	padding: 0em 0.5em;
	margin-right: 0.25em;
	color: var(--blue-light);
	background-color: var(--bg-alt);
	border: solid 1px var(--blue-dark);
}

a.button:hover {
	color: var(--gold);
	border-color: var(--gold-dark);
	text-decoration: none;
}

a.primary   { font-size: 100%; }
a.secondary { font-size: 90%; }


/* ==========================================================================
   5. HEADER + TABS
   ========================================================================== */

table#header {
	width: 100%;
	margin-bottom: 2em;
}

table#header td.logo {
	width: 75px;
	vertical-align: middle;
}

table#header td.main {
	font-size: 250%;
	padding-left: 10px;
	white-space: nowrap;
	color: var(--gold);
}

table#header td.main a:hover {
	text-decoration: none;
}

table#header td.form {
	text-align: right;
	vertical-align: bottom;
	padding-right: 1em;
	padding-bottom: 2px;
	white-space: nowrap;
}

table#header td.sub {
	color: var(--fg-muted);
	border-top: solid 1px var(--blue-dark);
	padding-left: 10px;
}

table.tabs {
	width: 100%;
	margin-top: 0px;
	margin-bottom: 0px;
	\*border-bottom: solid 10px var(--gold);*\
}

table.tabs td {
	padding: 10px 2em;
	vertical-align: top;
}

table.tabs td a {
	padding: 2px 0.75em;
	color: var(--fg-muted);
	font-size: 110%;
}

table.tabs td a:hover {
	color: var(--blue-light);
	text-decoration: none;
}

table.tabs td.form {
	text-align: right;
}

table.tabs td.form form {
	padding-bottom: 2px;
	white-space: nowrap;
}

/* small type for every header/tab-bar control */
table#header td.form form,
table#header td.form input,
table#header td.form select,
table.tabs td.form form,
table.tabs td.form input,
table.tabs td.form select {
	font-size: 90%;
}

/* little "external link" arrow after off-site tabs */
table.tabs a[href^="http://"]:after,
table.tabs a[href^="https://"]:after {
	content: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAQAAAAnOwc2AAAAAmJLR0QA/4ePzL8AAAAJcEhZcwAACxMAAAsTAQCanBgAAAAHdElNRQfgAhcJDQY+gm2TAAAAHWlUWHRDb21tZW50AAAAAABDcmVhdGVkIHdpdGggR0lNUGQuZQcAAABbSURBVAhbY2BABs4MU4CwhYHBh2Erww4wrGFQZHjI8B8IgUIscJWyDHcggltQhI4zGDCcRwhChPggHIggP1QoAVmQkSETrGoHsiAEsACtBYN0oDAMbgU6EBcAAL2eHUt4XUU4AAAAAElFTkSuQmCC);
	opacity: 0.5;
	margin: 0 0 0 5px;
}

div.path {
	margin: 0px;
	padding: 5px 2em 2px 2em;
	color: var(--gold);
	background-color: var(--bg-raised);
}

div.content {
	margin: 0px;
	padding: 2em;
	border-bottom: none;
}


/* ==========================================================================
   6. LISTS (repo index, log, tree)
   ========================================================================== */

table.list {
	width: 100%;
	border: none;
}

table.list tr                 { background: var(--bg); }
table.list tr:nth-child(even) { background: var(--bg-alt); }
table.list tr:hover           { background: var(--bg-hover); }
table.list tr.logheader       { background: var(--bg-raised); }

/* rows that opt out of hover highlighting */
table.list tr.nohover,
table.list tr.nohover:hover,
table.list tr.nohover-highlight:hover:nth-child(odd) {
	background: var(--bg);
}

table.list tr.nohover-highlight:hover:nth-child(even) {
	background: var(--bg-alt);
}

table.list th {
	font-weight: bold;
	color: var(--gold);
	\*border-bottom: solid 1px var(--blue-dark);*\
	padding: 0.1em 0.5em 0.05em 0.5em;
	vertical-align: baseline;
}

table.list th a:hover {
	text-decoration: none;
}

table.list td {
	border: none;
	padding: 0.5em 0.5em 0.5em 0.5em;
}

table.list td a         { color: var(--fg); }
table.list td a:hover   { color: var(--blue-light); }

table.list td a.ls-dir {
	font-weight: bold;
	color: var(--blue-light);
}

table.list td.logsubject {
	font-weight: bold;
	color: var(--fg);
}

table.list td.logmsg {
	white-space: pre;
	padding: 0 0.5em;
	color: var(--fg-muted);
}

table.list td.reposection {
	font-style: bold;
	color: var(--gold-dim);
}

table.list td.sublevel-repo {
	padding-left: 1.5em;
}

td.ls-size,
td.ls-mode {
	width: 10em;
	color: var(--fg-muted);
}

td.ls-size {
	text-align: right;
}

table.nowrap td {
	white-space: nowrap;
}

/* commit graph - one color per lane */
table.list td.commitgraph {
	white-space: pre;
}

td.commitgraph .column1 { color: var(--red); }
td.commitgraph .column2 { color: var(--green); }
td.commitgraph .column3 { color: var(--gold); }
td.commitgraph .column4 { color: var(--blue-light); }
td.commitgraph .column5 { color: var(--purple); }
td.commitgraph .column6 { color: var(--cyan); }


/* ==========================================================================
   7. BLOB + BLAME
   ========================================================================== */

div#blob {
	border: solid 1px var(--border);
}

table.blob {
	margin-top: 0.5em;
	border-top: solid 1px var(--border);
}

table.blob td.hashes,
table.blob td.lines {
	margin: 0;
	padding: 0 0 0 0.5em;
	vertical-align: top;
	color: var(--fg);
}

table.blob td.linenumbers {
	margin: 0;
	padding: 0 0.5em 0 0.5em;
	vertical-align: top;
	text-align: right;
	border-right: 1px solid var(--blue-dark);
}

table.blob pre {
	padding: 0;
	margin: 0;
}

/* line-number gutter links, blob + side-by-side diff */
table.blob td.linenumbers a,
table.ssdiff td.lineno a {
	color: var(--fg-dim);
	text-align: right;
	text-decoration: none;
}

table.blob td.linenumbers a:hover,
table.ssdiff td.lineno a:hover {
	color: var(--gold);
}

table.blame td.hashes,
table.blame td.lines,
table.blame td.linenumbers {
	padding: 0;
}

table.blame td.hashes div.alt,
table.blame td.lines div.alt {
	padding: 0 0.5em 0 0.5em;
}

table.blame td.linenumbers div.alt {
	padding: 0 0.5em 0 0;
}

table.blame div.alt:nth-child(odd)  { background: var(--bg); }
table.blame div.alt:nth-child(even) { background: var(--bg-alt); }

table.blame td.lines > div {
	position: relative;
}

table.blame td.lines > div > pre {
	padding: 0 0 0 0.5em;
	position: absolute;
	top: 0;
}

table.blame .oid {
	font-size: 100%;
}

table.bin-blob {
	margin-top: 0.5em;
	border: solid 1px var(--border);
}

table.bin-blob th {
	white-space: pre;
	color: var(--gold);
	border: solid 1px var(--blue-dark);
	padding: 0.5em 1em;
}

table.bin-blob td {
	white-space: pre;
	border-left: solid 1px var(--blue-dark);
	padding: 0em 1em;
}


/* ==========================================================================
   8. COMMIT VIEW
   ========================================================================== */

table.commit-info {
	margin-top: 1.5em;
}

table.commit-info th {
	text-align: left;
	font-weight: normal;
	color: var(--fg-muted);
	padding: 0.1em 1em 0.1em 0.1em;
	vertical-align: top;
}

table.commit-info td {
	font-weight: normal;
	color: var(--fg);
	padding: 0.1em 1em 0.1em 0.1em;
}

div.commit-subject {
	font-weight: bold;
	font-size: 125%;
	color: var(--gold);
	margin: 1.5em 0em 0.5em 0em;
	padding: 0em;
}

div.commit-msg {
	white-space: pre;
	color: var(--fg);
}

div.notes {
	white-space: pre;
	color: var(--gold);
	border: solid 1px var(--gold-dark);
	background-color: var(--gold-faint);
	padding: 0.3em 2em 0.3em 1em;
	float: left;
}

div.notes-footer {
	clear: left;
}

/* object id / hash, everywhere it appears */
.oid {
	font-size: 90%;
	color: var(--gold);
}

/* gold links: titles, table headers, hashes.
 * These are specific enough to outrank the generic a:hover above,
 * so they stay gold on hover too. */
table#header td.main a,
table.list th a,
a.oid,
.oid a {
	color: var(--gold);
}

/* the boxed control panels (diff options, etc.) */
div.cgit-panel {
	float: right;
	margin-top: 1.5em;
}

div.cgit-panel th {
	text-align: center;
	color: var(--gold);
}

div.cgit-panel td          { padding: 0.25em 0.5em; }
div.cgit-panel td.label    { padding-right: 0.5em; }
div.cgit-panel td.ctrl     { padding-left: 0.5em; }


/* ==========================================================================
   9. DIFFSTAT
   ========================================================================== */

div.notes-header,
div.diffstat-header {
	font-weight: bold;
	color: var(--gold);
	padding-top: 1.5em;
}

div.cgit-panel table,
table.diffstat {
	border: solid 1px var(--blue-dark);
	background-color: var(--bg-alt);
}

table.diffstat th {
	font-weight: normal;
	text-align: left;
	text-decoration: underline;
	color: var(--gold);
	padding: 0.1em 1em 0.1em 0.1em;
	font-size: 100%;
}

table.diffstat td {
	padding: 0.2em 0.2em 0.1em 0.1em;
	font-size: 100%;
	border: none;
}

table.diffstat td.mode {
	white-space: nowrap;
	color: var(--fg-muted);
}

table.diffstat td span.modechange {
	padding-left: 1em;
	color: var(--red);
}

table.diffstat td.upd a { color: var(--blue-light); }

/* the little bar graph beside each file */
table.diffstat td.graph {
	width: 500px;
	vertical-align: middle;
}

table.diffstat td.graph table {
	border: none;
}

table.diffstat td.graph td {
	padding: 0px;
	border: 0px;
	height: 7pt;
}

table.diffstat td.graph td.add { background-color: var(--green); }
table.diffstat td.graph td.rem { background-color: var(--red); }

div.diffstat-summary {
	color: var(--fg-muted);
	padding-top: 0.5em;
}


/* ==========================================================================
   10. UNIFIED DIFF
   ========================================================================== */

table.diff,
table.ssdiff {
	width: 100%;
}

table.diff td {
	white-space: pre;
	color: var(--fg);
}

table.diff td div.head {
	font-weight: bold;
	margin-top: 1em;
	color: var(--gold);
}

table.diff td div.hunk {
	color: var(--blue-light);
}

/* added / removed, wherever they are named */
table.diff td div.add,
table.diffstat td.add a,
span.insertions {
	color: var(--green);
}

table.diff td div.del,
table.diffstat td.del a,
span.deletions {
	color: var(--red);
}


/* ==========================================================================
   11. SIDE-BY-SIDE DIFF

   Each kind of line has two shades: the plain class for one column, the
   _dark class for the other, plus a stronger span for the changed run
   inside the line.
   ========================================================================== */

table.ssdiff td {
	font-size: 75%;
	white-space: pre;
	color: var(--fg);
	padding: 1px 4px 1px 4px;
	border-left: solid 1px var(--border);
	border-right: solid 1px var(--border);
}

table.ssdiff td.add,
table.ssdiff td.add_dark,
table.ssdiff td.del,
table.ssdiff td.del_dark,
table.ssdiff td.changed,
table.ssdiff td.changed_dark {
	color: var(--fg);
	min-width: 50%;
}

table.ssdiff td.add          { background: var(--green-faint); }
table.ssdiff td.add_dark     { background: var(--green-mid); }
table.ssdiff td.del          { background: var(--red-faint); }
table.ssdiff td.del_dark     { background: var(--red-mid); }
table.ssdiff td.changed      { background: var(--changed-faint); }
table.ssdiff td.changed_dark { background: var(--changed-mid); }

table.ssdiff span.add,
table.ssdiff span.del {
	font-weight: bold;
}

table.ssdiff span.add {
	background: var(--green-strong);
	color: var(--green);
}

table.ssdiff span.del {
	background: var(--red-strong);
	color: var(--red);
}

table.ssdiff td.lineno {
	color: var(--fg-dim);
	background: var(--bg-alt);
	text-align: right;
	width: 3em;
	min-width: 3em;
}

table.ssdiff td.hunk {
	color: var(--blue-light);
	background: var(--blue-faint);
	border-top: solid 1px var(--border);
	border-bottom: solid 1px var(--border);
}

table.ssdiff td.head {
	border-top: solid 1px var(--border);
	border-bottom: solid 1px var(--border);
}

table.ssdiff td.head div.head,
ul.pager .current {
	font-weight: bold;
	color: var(--gold);
}

table.ssdiff td.foot {
	border-top: solid 1px var(--border);
	border-left: none;
	border-right: none;
	border-bottom: none;
}

table.ssdiff td.space {
	border: none;
}

table.ssdiff td.space div {
	min-height: 3em;
}


/* ==========================================================================
   12. MISC BITS
   ========================================================================== */

table#grid {
	margin: 0px;
}

td#content {
	vertical-align: top;
	padding: 1em 2em 1em 1em;
	border: none;
}

div#summary {
	vertical-align: top;
	margin-bottom: 1em;
}

table#downloads {
	float: right;
	border: solid 1px var(--blue-dark);
	margin-left: 0.5em;
	margin-bottom: 0.5em;
}

/* gold on raised: active tab + download box header */
table#downloads th,
table.tabs td a.active {
	color: var(--gold);
	background-color: var(--bg-raised);
}


/* ==========================================================================
   13. REF DECORATIONS (branch / tag / remote badges)
   ========================================================================== */

a.branch-deco,
a.tag-deco,
a.tag-annotated-deco,
a.remote-deco,
a.deco {
	margin: 0px 0.5em;
	padding: 0px 0.25em;
	border: solid 1px;
}

a.branch-deco {
	color: var(--green);
	background-color: var(--green-faint);
	border-color: var(--green-dark);
}

a.tag-deco {
	color: var(--gold);
	background-color: var(--gold-faint);
	border-color: var(--gold-dark);
}

a.tag-annotated-deco {
	color: var(--gold-dim);
	background-color: var(--gold-faint);
	border-color: var(--gold-dim);
}

a.remote-deco {
	color: var(--blue-light);
	background-color: var(--blue-faint);
	border-color: var(--blue-dark);
}

/* anything else (HEAD, etc.) */
a.deco {
	color: var(--red);
	background-color: var(--red-faint);
	border-color: var(--red-dark);
}

a.branch-deco:hover,
a.tag-deco:hover,
a.tag-annotated-deco:hover,
a.remote-deco:hover,
a.deco:hover {
	text-decoration: none;
	border-color: var(--gold);
}

/* smaller when shown next to a commit subject */
div.commit-subject a.branch-deco,
div.commit-subject a.tag-deco,
div.commit-subject a.tag-annotated-deco,
div.commit-subject a.remote-deco,
div.commit-subject a.deco {
	margin-left: 1em;
	font-size: 75%;
}


/* ==========================================================================
   14. STATS + GRAPHS
   ========================================================================== */

table.stats {
	border: solid 1px var(--blue-dark);
}

table.stats th {
	text-align: left;
	color: var(--gold);
	padding: 1px 0.5em;
	background-color: var(--bg-raised);
	border: solid 1px var(--blue-dark);
}

table.stats td {
	text-align: right;
	color: var(--fg);
	padding: 1px 0.5em;
	border: solid 1px var(--blue-dark);
}

table.stats td.total {
	font-weight: bold;
	text-align: left;
}

table.stats td.sum {
	color: var(--gold);
	font-weight: bold;
}

table.stats td.left {
	text-align: left;
}

table.vgraph {
	border-collapse: separate;
	border: solid 1px var(--blue-dark);
	height: 200px;
}

table.hgraph {
	border: solid 1px var(--blue-dark);
	width: 800px;
}

table.vgraph th,
table.hgraph th {
	background-color: var(--bg-raised);
	color: var(--gold);
	font-weight: bold;
	padding: 1px 0.5em;
	border: solid 1px var(--blue-dark);
}

table.vgraph th {
	border-color: var(--bg);
}

table.vgraph td {
	vertical-align: bottom;
	padding: 0px 10px;
}

table.hgraph td {
	vertical-align: middle;
	padding: 2px 2px;
}

table.vgraph div.bar,
table.hgraph div.bar {
	background-color: var(--blue);
}

table.hgraph div.bar {
	height: 1em;
}


/* ==========================================================================
   15. AGES  (fades from green to grey as commits get older)
   ========================================================================== */

span.age-mins   { color: var(--green); font-weight: bold; }
span.age-hours  { color: var(--green); }
span.age-days   { color: var(--green-dim); }
span.age-weeks  { color: var(--fg-muted); }
span.age-months { color: var(--fg-dim); }
span.age-years  { color: var(--fg-faint); }


/* ==========================================================================
   16. PAGER + FOOTER
   ========================================================================== */

ul.pager {
	list-style-type: none;
	text-align: center;
	margin: 1em 0em 0em 0em;
	padding: 0;
}

ul.pager li {
	display: inline-block;
	margin: 0.25em 0.5em;
}

ul.pager a {
	color: var(--fg-muted);
}

ul.pager a:hover {
	color: var(--blue-light);
}

div.footer {
	margin-top: 0.5em;
	text-align: center;
	font-size: 80%;
	color: var(--fg-dim);
}


/* ==========================================================================
   17. SYNTAX HIGHLIGHTING
   Class names come from `highlight` (andre-simon.de); retuned for this theme.
   ========================================================================== */

table.blob .num { color: var(--orange); }              /* numbers */
table.blob .str,
table.blob .pps { color: var(--gold); }                /* strings */
table.blob .esc,
table.blob .kwd { color: var(--purple); }              /* escapes, keyword group d */
table.blob .kwa,
table.blob .kwc { color: var(--blue-light); font-weight: bold; }
table.blob .kwb { color: var(--cyan); }
table.blob .slc,
table.blob .com { color: var(--comment); font-style: italic; }
table.blob .ppc { color: var(--green); }               /* preprocessor */
table.blob .opt { color: var(--fg); }                  /* operators */
table.blob .lin { color: var(--fg-dim); }              /* line numbers */