/*
 * ABAPGIT COLOR THEME CSS - DEFAULT
 */

:root {
  --theme-background-color: #E8E8E8;
  --theme-container-background-color: #f2f2f2;
  --theme-container-border-color: lightgrey;
  --theme-table-background-color: white;
  --theme-table-head-background-color: #edf2f9;
  --theme-table-border-color: #ddd;
  --theme-table-cell-border-color: #eee;

  --theme-primary-font: "72", Arial, Helvetica, sans-serif;
  --theme-primary-font-color: #333333;
  --theme-primary-font-color-reduced: #ccc;
  --theme-font-size: 12pt;
  --theme-link-color: #4078c0;

  --theme-greyscale-dark: #808080;
  --theme-greyscale-medium: #b3b3b3;
  --theme-greyscale-light: #ccc;
  --theme-greyscale-lighter: lightgrey;
  --theme-linkhint-background: lightgreen;
  --theme-debug-color: #aaa;
}

/* GLOBALS */

body {
  background-color: var(--theme-background-color);
  font-family: var(--theme-primary-font);
  color: var(--theme-primary-font-color);
  font-size: var(--theme-font-size);
}
a, a:visited  { color: var(--theme-link-color); }
.link  {
  color: var(--theme-link-color);
  cursor: pointer;
}

input, textarea, select     { border-color: #ddd; }
input:focus, textarea:focus { border-color: #8cadd9; }

/* COLOR PALETTE */

.grey         { color: var(--theme-greyscale-lighter) !important; }
.grey70       { color: var(--theme-greyscale-medium)  !important; }
.grey80       { color: var(--theme-greyscale-light)   !important; }
.darkgrey     { color: var(--theme-greyscale-dark)    !important; }
.bgorange     { background-color: orange; }
.attention    { color: red        !important; }
.error        { color: #d41919    !important; }
.warning      { color: #efb301    !important; }
.success      { color: green      !important; }
.blue         { color: #5e8dc9    !important; }
.red          { color: red        !important; }
.white        { color: white      !important; }
.pink         { color: pink       !important; }

/* FLOATING BUTTONS AND COLOR SETS */

.blue-set {
  border-color: #abc3e3;
  color: #5e8dc9;
  background-color: #d9e4f2;
}
.grey-set {
  border-color: #c7c7c7;
  color: var(--theme-greyscale-dark);
  background-color: #e6e6e6;
}

/* ABAPGIT OBJECTS */

span.user-box {
  border-color: #c2d4ea;
  background-color: #d9e4f2;
}
span.package-box {
  border-color: #d3ccd2;
  background-color: #ebe3ea;
}
span.path-box,
span.transport-box {
  border-color: #a7e3cf;
  background-color: #dbf3eb;
}

/* PANELS */
/* TODO: add warning and error colors */

div.panel.success {
  color: #589a58 !important;
  background-color: #c5eac5;
}
div.panel.error {
  color: #d41919;
  background-color: #fad6d6;
}
#debug-output { color: var(--theme-debug-color); }
div.dummydiv { background-color: var(--theme-container-background-color); }

/* STRUCTURE DIVS, HEADER & FOOTER */

div#header {
  background-color: var(--theme-background-color);
  border-bottom-color: var(--theme-container-border-color);
}
div#header .page-title { color: var(--theme-greyscale-medium); }
div#footer .version { color: var(--theme-greyscale-medium); }
div#footer { border-top-color: var(--theme-container-border-color); }

/* ERROR LOG */

div.log {
  background-color: #fee6e6;
  border-color: #fdcece;
}

/* REPOSITORY */

div.repo { background-color: var(--theme-container-background-color); }
.repo_name span.name { color: #333; }
.repo_name span.url  { color: var(--theme-primary-font-color-reduced); }
.repo_name a.url { color: var(--theme-primary-font-color-reduced); }
.repo_name a.url:hover { color: var(--theme-link-color); }
.repo_attr       { color: grey; }

.repo_attr span.bg_marker {
  border-color: #d2d2d2;
  background-color: #d8d8d8;
  color: #fff;
}

.repo_attr span.branch_head {
  border-color: #d8dff3;
  background-color: #eceff9;
}

span.branch {
  border-color: #d9d9d9;
  background-color: #e2e2e2;
}

span.branch_branch {
  border-color: #e7d9b1;
  background-color: #f8f0d8;
}

/* REPOSITORY TABLE*/

table.repo_tab {
  border-color: var(--theme-table-border-color);
  background-color: var(--theme-table-background-color);
}
.repo_tab th {
  color: var(--theme-link-color);
  background-color: #edf2f9;
  border-bottom-color: var(--theme-table-border-color);
}
.repo_tab td {
  color: var(--theme-primary-font-color);
}

.repo_tab tr.object_row{
  border-top-color: var(--theme-table-cell-border-color);
}
.repo_tab .inactive      { color: orange; }
.repo_tab tr.unsupported { color: var(--theme-greyscale-lighter); }
.repo_tab tr.modified    { background-color: #fbf7e9; }
.repo_tab td.current_dir { color: var(--theme-primary-font-color-reduced); }

/* STAGE */

.stage_tab {
  border-color: #ddd;
  background-color: #fff;
}
.stage_tab th {
  color: var(--theme-greyscale-dark);
  background-color: #edf2f9;
  border-bottom-color: #ddd;
}
.stage_tab td {
  color: var(--theme-greyscale-medium);
  border-top-color: var(--theme-table-cell-border-color);
}
.stage_tab td.status {
  color: var(--theme-primary-font-color-reduced);
  background-color: #fafafa;
}
.stage_tab td.highlight { color: #444 !important; }
.stage_tab td.method { font-weight: bold; }
.stage_tab mark {
  color: white;
  background-color: #79a0d2;
}

/* COMMIT */

div.form-container { background-color: #F8F8F8; }
form.aligned-form label { color: var(--theme-greyscale-medium); }
form.aligned-form span.sub-title { color: var(--theme-greyscale-medium); }

/* SETTINGS STYLES */

div.settings_container {
  color: #444;
  background-color: var(--theme-container-background-color);
}

/* DIFF */

div.diff { background-color: var(--theme-container-background-color); }
span.diff_name { color: grey; }
span.diff_name strong { color: #333; }
span.diff_changed_by  { color: grey; }
span.diff_changed_by span.user {
  border-color: #c2d4ea;
  background-color: #d9e4f2;
}
.diff_ins {
  border-color: #abf2ab;
  background-color: #e0ffe0;
}
.diff_del {
  border-color: #ff667d;
  background-color: #ffccd4;
}
.diff_upd {
  border-color: #dada00;
  background-color: #ffffcc;
}
div.diff_content {
  background-color: #fff;
  border-top-color: #ddd;
  border-bottom-color: #ddd;
}

/* STATE BLOCK COLORS */

span.state-block span.added {
  background-color: #69ad74;
  border-color: #579e64;
  color: white;
}
span.state-block span.changed {
  background-color: #e0c150;
  border-color: #d4af25;
  color: white;
}
span.state-block span.mixed {
  background-color: #e0c150;
  border-color: #579e64;
  color: #69ad74;
}
span.state-block span.deleted {
  background-color: #c76861;
  border-color: #b8605a;
  color: white;
}
span.state-block span.none {
  background-color: #e8e8e8;
  border-color: #dbdbdb;
  color: #c8c8c8;
}

/* DIFF TABLE */

table.diff_tab td,
table.diff_tab th {
  color: #444;
}
table.diff_tab thead.header th {
  color: #eee;
  background-color: var(--theme-greyscale-medium);
}
table.diff_tab thead.nav_line {
  background-color: #edf2f9;
}
table.diff_tab thead.nav_line th {
  color: var(--theme-greyscale-medium);
}
table.diff_tab td.num, th.num {
  color: var(--theme-primary-font-color-reduced);
  border-left-color: var(--theme-table-cell-border-color);
  border-right-color: var(--theme-table-cell-border-color);
}
table.diff_tab td.patch, th.patch {
  color: var(--theme-primary-font-color-reduced);
  border-left-color: var(--theme-table-cell-border-color);
  border-right-color: var(--theme-table-cell-border-color);
}

/* STYLES FOR SYNTAX HIGHLIGHTING */

/* ABAP */
.syntax-hl span.keyword  { color: #0a69ce; }
.syntax-hl span.text     { color: #48ce4f; }
.syntax-hl span.comment  { color: var(--theme-greyscale-dark); font-style: italic; }
/* XML+HTML */
.syntax-hl span.xml_tag  { color: #457ce3; }
.syntax-hl span.attr     { color: #b777fb; }
.syntax-hl span.attr_val { color: #7a02f9; }
/* CSS+JS */
.syntax-hl span.properties   { color:#0a69ce; }
.syntax-hl span.values       { color:blue; }
.syntax-hl span.units        { color:maroon; }
.syntax-hl span.selectors    { color:purple; }
.syntax-hl span.functions    { color:purple; }
.syntax-hl span.colors       { color:purple; }
.syntax-hl span.extensions   { color:darkblue; }
.syntax-hl span.at_rules     { color:darkblue; }
.syntax-hl span.html         { color:green; }
.syntax-hl span.variables    { color:purple; }

/* DEBUG INFO STYLES */

div.debug_container {
  color: #444;
  background-color: var(--theme-container-background-color);
}

/* Repo overview */

.repo-overview { background-color: var(--theme-container-background-color); }
.repo-overview table {
  background-color: var(--theme-table-background-color);
  border-color: var(--theme-table-border-color);
}
.repo-overview th {
  color: var(--theme-link-color);
}
.repo-overview thead tr {
  background-color: var(--theme-table-head-background-color);
}
.repo-overview thead tr,
.repo-overview tfoot tr {
  border-color: var(--theme-table-border-color);
}
.repo-overview a.remote_repo { color: var(--theme-primary-font-color-reduced); }
.repo-overview a.remote_repo:hover { color: var(--theme-link-color); }
.repo-overview tbody tr:hover td { background-color: hsla(214, 50%, 50%, 0.05); }
.repo-overview tbody tr.selected { background-color: hsla(214, 50%, 75%, 0.33); }

/* TUTORIAL */

div.tutorial { background-color: var(--theme-container-background-color); }
div.tutorial hr { border-color: var(--theme-greyscale-light); }
div.tutorial h1, h2 { color: #404040; }

/* MENU */

.nav-container ul li:hover { background-color: #fff; }
.nav-container ul ul li:hover { background-color: #f6f6f6; }
.nav-container > ul > li:hover > a { background-color: #ffffff80; }
.nav-container ul ul { background-color: #fff; }
.nav-container.corner > ul > li:hover > a { background-color: inherit; }

.nav-container ul ul li.separator {
  color: var(--theme-greyscale-medium);
  border-bottom-color: #eee;
  border-top-color: #eee;
}
.nav-container ul ul li.separator:hover { background-color: inherit; }

/* NEWS ANNOUNCEMENT */

div.info-panel { background-color: white; }
div.info-panel div.info-hint { color: var(--theme-greyscale-light); }
div.info-panel div.info-title {
  color: #f8f8f8;
  background-color: #888;
}
div.info-panel div.info-title a.close-btn { color: #d8d8d8; }
div.info-panel div.info-list { color: #444; }
div.info-panel .version-marker {
  color: white;
  border-color: #c0c0c0;
  background-color: var(--theme-greyscale-light);
}
div.info-panel .update {
  border-color: #e8ba30;
  background-color: #f5c538;
}

/* TOOLTIPS TEXT */

.link-hint { color: var(--theme-primary-font-color); }
.link-hint { background-color: var(--theme-linkhint-background) }
.link-hint::after { border-top-color: var(--theme-linkhint-background) }

/* HOTKEYS */

ul.hotkeys span.key-id {
  background-color: #f0f0f0;
  border-color: #dcdcdc;
}
div.corner-hint {
  color: var(--theme-greyscale-medium);
  border-color: var(--theme-greyscale-light);
  background-color: #fff;
}

/* CODE INSPECTOR */

div.ci { background-color: var(--theme-container-background-color); }

div.ci-msg span.ci-variant { color: var(--theme-primary-font-color); }

div.ci-stats span.error-count {
  border-color: hsl(350, 100%, 80%);
  background-color: hsl(350, 100%, 90%);
}
div.ci-stats span.warn-count {
  border-color: hsl(60, 100%, 42%);
  background-color: hsl(60, 100%, 90%);
}
div.ci-stats span.info-count {
  border-color: hsl(120, 80%, 80%);
  background-color: hsl(120, 80%, 94%);
}
div.ci-stats span.all-count {
  border-color: hsl(235, 100%, 89%);
  background-color: hsl(235, 100%, 93%);
}
div.ci-detail table td[data-cid="text"] {
  color: hsl(0, 0%, 40%);
}

div.ci-detail table tr[data-kind="error"] td[data-cid="kind"] span {
  background-color: hsl(0, 100%, 68%);
}
div.ci-detail table tr[data-kind="warning"] td[data-cid="kind"] span {
  background-color:hsl(52, 100%, 49%);
}
div.ci-detail table tr[data-kind="info"] td[data-cid="kind"] span {
  background-color: hsl(118, 67%, 47%);
}

/* COMMAND PALETTE */

.cmd-palette {
  border-color: #ccc;
}
.cmd-palette li.selected {
  background-color: hsla(214, 50%, 90%, 1);
}
.cmd-palette mark {
  color: white;
  background-color: #79a0d2;
  /* todo merge with stage search */
}

/* SETTINGS */

table.settings_tab {
  background-color: #fff;
  border-color: #ddd;
}
table.settings_tab th {
  color: #888888;
  border-bottom-color: #ddd;
}
table.settings_tab td {
  color: #333;
  border-top-color: #eee;
}
table.settings_tab input {
  background-color: #f8f8f8;
}
table.settings_tab input:focus {
  background-color: #fff;
}

/* HTML FORMS */

.dialog input::placeholder { color: #ccc }
.dialog textarea::placeholder { color: #ccc }
.dialog input:-ms-input-placeholder { color: #ccc }
.dialog textarea:-ms-input-placeholder { color: #ccc }
.dialog {
  border-color: #ccc;
  background-color: #f0f0f0;
}
.dialog li.dialog-commands a,
.dialog li.dialog-commands input[type="submit"] {
  border-color: #ccc;
  background-color: #ddd;
  color: #000;
}
.dialog li.dialog-commands a.main,
.dialog li.dialog-commands input[type="submit"].main {
  background-color: #64a8ff;
  color: #fff;
}
.dialog label {
  color: #444;
}
.dialog label em {
  color: #64a8ff;
}
.dialog li.error small {
  color: #ff5959;
}
.dialog li.error input[type="number"],
.dialog li.error input[type="text"] {
  border-color: #ff5959;
}
.dialog .radio-container {
  border-color: #ddd;
  background-color: #fff;
}
.dialog .radio-container input[type="radio"]:checked + label {
  background-color: #64a8ff;
  color: #fff;
}
.dialog li.with-command input[type="button"]:hover,
.dialog li.with-command input[type="submit"]:hover {
  background-color: #64a8ff;
  color: #fff;
}
.dialog fieldset {
  border-color: #dfdfdf;
}
.dialog fieldset legend {
  color: #444;
}
.dialog input:read-only {
  background-color: #f4f4f4;
  color: var(--theme-greyscale-dark);
}
/* for IE */
.dialog input[readonly] {
  background-color: #f4f4f4;
  color: var(--theme-greyscale-dark);
}