body,
html {
  padding-bottom: 25px;
}


/* .value table * {
  border: none !important;
} */

/* Remove blue outline from active/focus input field,
   e.g. datatables search field
*/
.form-control:focus {
  outline: none !important;
  box-shadow: none !important;
}

select:focus {
  outline: none !important;
  box-shadow: none !important;
}

.c-bench-landing div.card {
  font-size: 0.81rem;
  border-radius: 0;
  border: 1px solid #4981C8aa;
}

.c-bench-landing div.card a {
  color: #4981C8;
  font-family: monospace;
  font-weight: normal;
  text-decoration: none;
}

.c-bench-landing div.card a:hover {
  font-weight: bold;
}

/*
:root {
 --bs-tooltip-padding-x: 5px;
 --bs-tooltip-border-radius: 0px;
}
*/

.c-bench-scrollbar {
  /* Foreground, Background */
  scrollbar-color: #201D38aa #f3f3f3;
  scrollbar-width: thin;
}
.c-bench-scrollbar::-webkit-scrollbar {
  width: 4px; /* Mostly for vertical scrollbars */
  height: 7px; /* Mostly for horizontal scrollbars */
}
.c-bench-scrollbar::-webkit-scrollbar-thumb { /* Foreground */
  background: #201D38aa;
  border-radius: 1px;
}
.c-bench-scrollbar::-webkit-scrollbar-track { /* Background */
  background: #f3f3f3;
  border-radius: 1px;
}

div.case-param-title code {
  color: #fff;
  font-size: 0.8rem;
}

div.case-param-title {
  /*border-bottom: 1px solid #81257022;*/
  padding: 0 3px 2px 5px;
  background-color: #812570BB;/* #47509E;*/
  margin-bottom: 1px;
}

div.case-param-values {
  color: #000000bb;
  max-height: 120px;
  overflow: auto;
  overflow-wrap: break-word;
  line-height: 110%;
  padding-left: 4px;
  padding-right: 5px;
  padding-bottom: 3px;
}

div.case-param-values .valcount {
  color: #00000077;
}

/*
.case-param-values.one-value {
  height: 25px !important;
}*/

div.case-param-panel {
  /* width: 125px; */
  /*
   explicit max-content instead of not setting width
   but with an upper bound. note that  this here now looks a bit like
   masonry.

   Note that the max-width here is a really interesting parameter that can be
   varied with the goal to maximize vertical space usage, try it out using
   the browser devtools (mouse over this value, use mouse wheel to vary it --
   with the flexbox grid setup everything else dynamically adjusts in a really
   interesting way!
  */
  max-width: 185px;
  width: max-content;
  margin-right: 6px;
  margin-top: 6px;
  border: 1px solid #4981C8aa;
}

table.results-in-run-table tbody tr td,
table.c-bench-caseperm-table tbody tr td {
  font-family: var(--bs-font-monospace);
  font-size: 0.8rem;
}

/*
table.c-bench-caseperm-table td.casepermstring {
  font-size: 12px;
}


table.c-bench-caseperm-table th {
  font-size: 12px;
}
*/

div.cb-title h1 {
  /* reduce default mb*/
  margin-bottom: 0.1rem;
}

div.cb-title div.cb-subtitle {
  /* fine-tune alignment*/
  margin-left: 3px;
}

div.cb-title hr {
  color: #812570;
  border-top: 1px solid;

}

div.cb-run-details-panel {
  background-color: #00505019;
  padding: 15px;

}

span.case-parm-value {
  font-family: monospace;
  font-size: 0.7rem;
  padding: 0px;
  padding-left: 2px;
  margin-left: 0px;
  margin-top: 2px;
  width:100%;
  display: block;
}

span.case-parm-value.selected {
  font-family: monospace;
  background-color: #7bffff;
}

div.cb-infobox {
  border: 1px solid #81257077;
  margin-top: 10px;
  padding: 15px;
}

div.offcanvas-cb-context pre {
  /* do not overflow horizontally: word wrap in pre.
    kudos to https://stackoverflow.com/a/45783868/145400 */
  white-space: pre-wrap;
  word-break: keep-all;
  font-size: 13px;
}


/* select.caseparm-select {
  overflow: auto !important;
  border: none;
  background: none;
  font-family: monospace;
} */

div.result-raw-data-container code {
  color: #812570aa;
}

div.cb-bmr-summary-item {
  padding-bottom: 13px;
}

div.cb-bmr-summary-item a {
  text-decoration: none;
}

div.cb-bmr-summary-item a:hover {
  font-weight: bold;

}

div.cb-tinyplot div.hardware {
  font-family: var(--bs-font-monospace);
  font-size: 11px;
  padding-left: 5px;
}

div.cb-tinyplot div.auxtitle {
  font-family: var(--bs-font-monospace);
  font-size: 11px;
  padding-left: 10px;
}


div.cb-tinyplot div.context {
  font-family: var(--bs-font-monospace);
  font-size: 11px;
  padding-left: 3px;
}

div.cb-tinyplot div.results {
  font-family: var(--bs-font-monospace);
  font-size: 11px;
  margin-right: 2px;
}

div.cb-tinyplot a {
  color: #812570
}

div.cb-tinyplot {
  background-color: #f8f9fa;
  /* make div as wide as content, not as wide as wrapper */
  display: inline-block;

}

/* fix blue border on button click */
.btn:focus,.btn:active {
  outline: none !important;
  box-shadow: none;
}

/* spacing between DT items */
div.dataTables_filter label {
  font-size: 12px;
  margin-left: 10px;
 }

table.dataTable a {
  /* color: #38BDD1; */
  color: #4981C8;

}

.brutal-break {
  word-break: break-all;
}

.pagination {
  --bs-pagination-active-bg: #47509E55;
}

div.dataTables_info {
  font-size: 12px;
}

/*
dark green #005050
dark blue #201D38
*/

th.cb-colgroup-run {
  background-color: #00505033;
  /* border-bottom: 3px #812570 solid !important; */
}

th.cb-colgroup-commit {
  /* background-color: #4981C822; */
  background-color: #201D3833;
  /* border-bottom: 3px #005050 solid !important; */
  /* border-bottom: 3px #4981C8 solid !important; */
}

div.dataTables_length label {
 font-size: 12px;
}

div.dataTables_length label select {
  font-size: 12px;
  outline: 0;
  border-radius: 0;
  border-width: 0 0 1px;
  border-color :#005050;
}

div.dataTables_filter label {
  font-size: 12px;
  margin-left: 10px;
 }

 div.dataTables_filter label input {
   font-size: 12px;
   outline: 0;
   border-radius: 0;
   border-width: 0 0 1px;
   border-color :#005050;
 }


/* table.dataTable thead th {
  border-bottom: 0px #C440C3 solid !important;
} */

/* Remove border around and within pagination bar
   in a datatables presentation. Also, remove outline upon button click.
*/
.dataTables_paginate .page-link {
  border: none;
  outline: none !important;
  box-shadow: none;
}

/* th:first-child {
  border-bottom: 4px solid #dddddd;
} */

/* table thead tr {
  border-bottom: 3px black;
} */

.table>thead>tr>th {
  vertical-align: top;
}

nav.navbar {
  background-color: #201D38;
}

div.cb-bm-summary {
  background-color: #f3f3f3;
  padding: 15px;
}

ol.breadcrumb a {
  color: #4981C8;
  font-family: monospace;
}

.border-danger {
  /* VD Dark Magenta
  border-color: #812570 !important;*/
  border-color: #C440C3 !important;
}

div.dataTables_filter input {
  box-shadow: none;
}


.custom-search-box{
  /*
  Note(JP): the `box-sizing: border-box` is so that padding of the outer
  container is respected when calculating the actual width of the input field.
  Also see https://github.com/twbs/bootstrap/issues/1058#issuecomment-5110547

  I think it makes most sense to set a column-specific width for these search
  boxes. Setting this to 90 % by default works around a per-browser absolute
  default (about ~150 px on Chrome, different on other browsers).

  For setting a column-specific width see below, e.g. va `th.commit-col
  input.custom-search-box { ... }`.
  */
  box-sizing: border-box;
  width: 90%;
  height: 25px;
  /* border: 1px solid #ccc;
  border-radius: 4px; */

  outline: 0;
  border-radius: 0;
  border-width: 0 0 1px;
  border-color :#00505066;
  background-color: transparent;

  margin-top: 5px;
}





/*----------------*/


[data-href] {
  cursor: pointer;
}

/*
.table.dataTable a {
  color: #1F77B4;
}

.table.dataTable caption a {
  color: #1F77B4;
  font-weight: bold;
}

.table.dataTable caption {
  color: #1F77B4;
}
*/
.submenu {
  color: #1F77B4;
}

.flash-message {
  position: relative; top: -20px;
  color: #737373;
}

/*
.tooltip-inner {
  background-color: #282828;
  max-width: 250px;
  width: 250px;
}


.tooltip.bottom .tooltip-arrow {
  top: 0;
  left: 50%;
  margin-left: -5px;
  border-bottom-color: #282828;
  border-width: 0 5px 5px;
}
*/

.carousel-control.left,.carousel-control.right {
  background:none;
  width:30px;
}

.carousel-control.left {
  left:-30px;
  color: #999999;
}

.carousel-control.right {
  right:-30px;
  color: #999999;
 }

.carousel-indicators li {
  background: #ccc;
}

.carousel-indicators .active {
  background: #1F77B4;
}

.ellipsis-175 {
  width: 175px;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.wordbreak-175 {
  width: 175px;
  overflow-wrap: break-word;
}

.ellipsis-500 {
  width: 500px;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

/*
.table-entry {
  width: -moz-fit-content;
  width: fit-content;
  padding: 3px;
}
*/
.hide-text{
   display: none;
}

.custom-input-text {
  font-weight: normal;
  font-size: 12px;
  padding: 3px;
}

/*
th.commit-col input.custom-search-box {
  width: 64px;
}

th.reason-col select.custom-search-box {
  width: 70px;
}
*/



/*
select.custom-search-box {
  background: #eee;
}
 */


.message-header{
  font-weight: normal;
  font-size: 10px;
  padding: 3px;
  border-style: dotted;
  border-width: thin;
}
