:root {
  /* General colors */
  --body-bg-color: rgb(19, 21, 22);
  --body-text-color: rgb(234, 234, 234);
  --table-border-color: rgb(43, 43, 43);

  --critical-color: #FF6F6F;
  --critical-bg: #330000;
  --high-color: #FFA500;
  --high-bg: #332600;
  --medium-color: #FFD700;
  --medium-bg: #333300;
  --low-color: #00BFFF;
  --low-bg: #001933;
  --unknown-color: #BEBEBE;
  --unknown-bg: #333333;
  --fixed-color: #32CD32;
  --fixed-bg: #003300;
}

body {
  background-color: var(--body-bg-color);
  color: var(--body-text-color);
}

h1 {
  margin-bottom: 0;
}

h1 .heading-anchor,
h2 .heading-anchor,
h3 .heading-anchor,
h4 .heading-anchor,
h5 .heading-anchor,
h6 .heading-anchor {
  margin-left: 0.4rem;
  color: inherit;
  text-decoration: none;
  opacity: 0;
}

h1:hover .heading-anchor,
h2:hover .heading-anchor,
h3:hover .heading-anchor,
h4:hover .heading-anchor,
h5:hover .heading-anchor,
h6:hover .heading-anchor,
.heading-anchor:focus {
  opacity: 0.75;
}

.heading-anchor:hover {
  opacity: 1;
}

fieldset {
  min-width: 100px;
  display: inline-block;
  border-color: transparent;
  padding: 0;
}

fieldset label {
  padding-right: 1em;
}

fieldset input {
  float: right;
  width: 300px;
}

#image {
  width: 400px;
}

/* align table headers left */

table {
  width: 100%;
  border-collapse: collapse;
}

table th {
  text-align: left;
}

tr {
  border-bottom: 1px solid var(--table-border-color);
}

table tr {
  line-height: 2em;
}

#cves th:not(:first-child) {
  padding-left: 0.5em;
  padding-right: 0.5em;
}

#cves td:not(:first-child) {
  padding-left: 0.5em;
  padding-right: 0.5em;
}

tr.CRITICAL > td:first-child {
  color: var(--critical-color);
  background-color: var(--critical-color);
}

tr.CRITICAL > td:nth-child(2) {
  color: var(--critical-color);
  background-color: var(--critical-bg);
}

tr.HIGH > td:first-child {
  color: var(--high-color);
  background-color: var(--high-color);
}

tr.HIGH > td:nth-child(2) {
  color: var(--high-color);
  background-color: var(--high-bg);
}

tr.MEDIUM > td:first-child {
  color: var(--medium-color);
  background-color: var(--medium-color);
}

tr.MEDIUM > td:nth-child(2) {
  color: var(--medium-color);
  background-color: var(--medium-bg);
}

tr.LOW > td:first-child {
  color: var(--low-color);
  background-color: var(--low-color);
}

tr.LOW > td:nth-child(2) {
  color: var(--low-color);
  background-color: var(--low-bg);
}

tr.UNKNOWN > td:first-child {
  color: var(--unknown-color);
  background-color: var(--unknown-color);
}

tr.UNKNOWN > td:nth-child(2) {
  color: var(--unknown-color);
  background-color: var(--unknown-bg);
}

.fixed_version {
  color: var(--fixed-color);
}

.severity_count {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  display: inline-block;
}

.severity_count li {
  float: left;
  margin-right: 10px; /* Adjust value to your preference */
  padding: 5px;
}

.severity_count li.critical {
  color: var(--critical-color);
  background-color: var(--critical-bg);
}

.severity_count li.high {
  color: var(--high-color);
  background-color: var(--high-bg);
}

.severity_count li.medium {
  color: var(--medium-color);
  background-color: var(--medium-bg);
}

.severity_count li.low {
  color: var(--low-color);
  background-color: var(--low-bg);
}

.severity_count li.unknown {
  color: var(--unknown-color);
  background-color: var(--unknown-bg);
}
