.input-group {
  flex-wrap: nowrap !important; }

#search-query {
  height: 48px;
  min-width: 0;
  flex: 1; }

#search-submit {
  height: 48px;
  flex-shrink: 0;
  white-space: nowrap; }

a.external::after {
  content: "\f08e";
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  color: #555;
  margin-left: 5px;
  vertical-align: super;
  font-size: 0.7em; }

.provisional::after {
  content: "[PROVISIONAL]";
  padding-left: 10px;
  color: purple;
  font-weight: bold; }

.jbrowse img {
  height: 36px;
  margin-left: 10px; }

#cell-tabs button:has(i.fas):hover, #cell-tabs button:has(i.fa-solid):hover {
  color: purple !important; }

.tabs {
  display: flex;
  align-items: flex-start;
  flex-wrap: nowrap;
  cursor: pointer;
  margin-bottom: 10px; }

#cell-tabs-list {
  display: flex;
  flex-wrap: wrap;
  flex: 1;
  align-items: center;
  row-gap: 5px; }

#cell-tabs-toolbar {
  flex-shrink: 0;
  margin-left: auto;
  display: flex;
  align-items: center; }

.tab {
  padding: 5px 20px;
  background: #eeeeee;
  border: 1px solid #cccccc;
  margin-right: 5px; }

.tab.active {
  background: #dddddd;
  font-weight: bold; }

fieldset {
  display: none;
  border: 1px solid #cccccc;
  padding: 10px; }

fieldset.active {
  display: block; }

#images-table-div img {
  width: 200px;
  height: auto;
  margin: 5px;
  cursor: pointer; }

.gene_expression .negative::after {
  content: "-";
  font-size: 1.5em;
  color: red;
  font-weight: bold;
  top: -3px;
  position: relative;
  margin-left: 0px; }
.gene_expression .low::after {
  content: "L";
  vertical-align: super;
  font-size: 0.8em;
  color: #ff8c00;
  font-weight: bold;
  margin-left: 0px; }
.gene_expression .high::after {
  content: "H";
  vertical-align: super;
  font-size: 0.8em;
  color: #228b22;
  font-weight: bold;
  margin-left: 0px; }

#cell-card-tree {
  font-size: 12px;
  font-family: "Roboto", sans-serif; }

#search-query {
  height: 48px;
  border-radius: 30px 0px 0px 30px;
  padding-left: 24px; }

#search-submit {
  height: 48px;
  border-radius: 0px 30px 30px 0px; }

#cell-cards-left-col {
  position: sticky;
  top: 10px;
  align-self: flex-start;
  z-index: 10; }

#cell-cards-left-col fieldset * {
  font-size: 14px; }

#cell-cards-left-col fieldset table {
  color: #005295; }
  #cell-cards-left-col fieldset table a,
  #cell-cards-left-col fieldset table a:hover {
    color: #198cea; }

fieldset {
  border: 0px solid #c0c0c0;
  margin: 0px;
  padding: 0px;
  /* margin: 0 2px; */
  /* padding: 0.35em 0.625em 0.75em; */ }

fieldset legend {
  width: auto;
  display: none;
  /* Hide legend by default */ }

figcaption {
  caption-side: bottom;
  text-align: left; }

.node text {
  font: 12px; }

.link {
  fill: none;
  stroke: #000000;
  stroke-width: 2px; }

.node {
  cursor: pointer; }

.cellcards-link {
  font-size: medium; }

.cellcards-jbrowse-icon {
  height: 36px;
  margin-left: 12px; }

#images {
  width: 1000px;
  display: inline-block;
  margin-left: 10px;
  margin-right: 40px; }

#images img {
  width: 600px;
  margin-left: 10px; }

#cell_card {
  width: 700px;
  display: inline-block;
  vertical-align: top; }

.cellcards-tree {
  margin-top: 24px !important; }

rect {
  fill: #ffffff;
  margin-right: 10px; }

text.highlighted {
  fill: #198cea;
  font-weight: bold;
  text-decoration: underline; }

.cellcards__nav,
.cellcards__nav__subnav {
  padding: 0;
  list-style-type: none; }

.cellcards__nav {
  line-height: 12px;
  text-align: left; }

.cellcards__nav li {
  display: inline-block; }

.cellcards__nav li:hover .cellcards__nav__subnav {
  display: block;
  opacity: 1; }

.cellcards__nav a {
  color: #005295;
  font-size: 17px; }

.cellcards__nav a svg {
  vertical-align: middle; }

.cellcards__nav__subnav {
  background: #ffffff;
  box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.2);
  display: none;
  line-height: normal;
  margin: -1px 0 0;
  max-width: 250px;
  min-width: 175px;
  opacity: 1;
  padding: 8px 0px;
  position: absolute;
  text-align: left;
  transition: opacity 0.2s;
  z-index: 100; }

.cellcards__nav__subnav li {
  display: block;
  padding: 2px; }

.cellcards__nav__subnav a {
  border-left: 2px solid transparent;
  color: #005295;
  font-size: 15px;
  display: block;
  margin: 0;
  padding: 4px 8px; }

.cellcards__nav__subnav a:hover {
  border-color: #005295; }

.cellcards__nav__subnav span {
  color: #005295;
  font-size: 15px;
  display: block;
  margin: 0;
  padding: 4px 8px;
  cursor: default; }

#datatable-modal {
  box-shadow: 0 10px 12px rgba(0, 0, 0, 0.5);
  width: 90%;
  height: 80%;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%); }

#datatable-table {
  margin: 10px;
  width: 95%; }

#datatable-table.hover tbody tr:hover {
  background-color: #66ecec; }

#datatable-table td:has(img) {
  padding: 0px; }

#datatable-table td:has(img) img {
  height: 30px; }

.contributor-content {
  margin-top: 10px; }

#contributors-modal {
  width: 80%;
  max-height: 60%;
  min-height: 400px;
  margin: auto;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  overflow: auto; }

#contributors-modal .modal-content {
  padding: 10px;
  border: 1px solid #cccccc;
  box-shadow: 0 6px 8px rgba(0, 0, 0, 0.3);
  min-height: 400px; }

.download-button {
  background-color: #005295;
  color: white;
  padding: 8px 16px;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  font-size: 14px;
  margin-top: 10px; }

.download-button:hover {
  background-color: #003f6b; }

/*# sourceMappingURL=cellcardspage.css.map */

/*# sourceMappingURL=cellcardspage.css.map */

/* ------------------------------------------------------------------ scRNA-Seq Markers
   The dot plot tab. The values here are the ones discover.css uses for the same figure,
   so the plot reads identically on both pages.

   EVERY SIZE IS DECLARED, NOT INHERITED. `#cell-cards-left-col fieldset *` sets 14px on
   every descendant of a fieldset, which would have applied to the SVG's <text> as well
   and given the axis labels the size of body copy. These rules carry a class, so they
   win on specificity and the plot keeps the 11px labels the geometry was measured for. */

#cellcards-markers-plot {
  font-size: 12.5px;
  color: #4a5866; }

/* 85 cell types are wider than the card. The plot scrolls in its own frame so the page
   never scrolls sideways and the gene labels stay at full size. */
#cell-cards-left-col .ccm-scroll {
  overflow-x: auto;
  overflow-y: hidden;
  max-width: 100%;
  padding-bottom: 0.4rem; }

#cell-cards-left-col .ccm-scroll svg {
  display: block; }

#cellcards-markers-plot text.ccm-axis {
  font-size: 11px;
  fill: #4a5866; }

/* The cell type this tab is about, named in bold on its own column. */
#cellcards-markers-plot text.ccm-own-label {
  font-weight: 700;
  fill: #14315c; }

#cellcards-markers-plot circle.ccm-own {
  stroke: #14315c;
  stroke-width: 0.6px; }

#cellcards-markers-plot a text.ccm-rowlink {
  cursor: pointer; }

#cellcards-markers-plot a:hover text.ccm-rowlink {
  fill: #14315c;
  text-decoration: underline; }

/* A colour scale without a key is a decoration. */
#cell-cards-left-col .ccm-legend {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  margin: 0 0 6px 2px; }

#cell-cards-left-col .ccm-legend span {
  font-size: 11px;
  color: #6b7885; }

#cell-cards-left-col .ccm-legend-bar {
  width: 96px;
  height: 8px;
  border-radius: 2px;
  border: 1px solid #d7dee4;
  display: inline-block; }

#cell-cards-left-col .ccm-legend-num {
  font-variant-numeric: tabular-nums;
  color: #2b3a47; }

/* The controls above the plot: the marker source, and the cell state where CellRef2
   splits the term into several. */
#cell-cards-left-col .ccm-controls {
  margin: 0 0 8px 2px;
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap; }

#cell-cards-left-col .ccm-controls label,
#cell-cards-left-col .ccm-controls select {
  font-size: 12.5px; }

#cell-cards-left-col .ccm-controls select {
  padding: 2px 6px;
  border: 1px solid #cccccc;
  background: #ffffff;
  color: #005295; }

/* A remark beside the controls: how CellRef2 splits the term, or which requested genes
   the atlas does not carry. Quieter than the controls, and never inside the caption. */
#cell-cards-left-col .ccm-controls .ccm-quiet {
  font-size: 11px;
  color: #6b7885; }

/* Save SVG and Save PNG, above the plot and to the right, in the idiom of the
   Discover page's own Download SVG button. */
#cell-cards-left-col .ccm-tools {
  display: flex;
  justify-content: flex-end;
  gap: 6px;
  margin: 0 2px 6px 2px; }

#cell-cards-left-col .ccm-tools .ccm-save {
  font-size: 12px;
  color: #005295;
  background: #ffffff;
  border: 1px solid #cccccc;
  border-radius: 3px;
  padding: 3px 10px;
  cursor: pointer; }

#cell-cards-left-col .ccm-tools .ccm-save:hover {
  background: #f2f6fa;
  border-color: #005295; }

#cell-cards-left-col .ccm-note {
  font-size: 11.5px;
  color: #6b7885;
  margin: 8px 2px 0 2px;
  max-width: 90ch; }

#cell-cards-left-col .ccm-busy,
#cell-cards-left-col .ccm-empty {
  font-size: 12.5px;
  color: #6b7885;
  margin: 8px 2px; }
