/* CSS variables */
:root {
   --ictv-alt-row-bg: #efefef;
   --ictv-border-color: #aaa;
   --ictv-border-focus-color: #80bdff;
   --ictv-button-bg: #ddd;
   --ictv-danger-color: #dc3545;
   --ictv-dark-grey-color: #555;
   --ictv-disabled-color: #999;
   --ictv-grey-color: #777;
   --ictv-icon-color: #888;
   --ictv-lightest-grey-color: #efefef;
   --ictv-light-grey-color: #888;
   --ictv-link-color: #0066cc;
   --ictv-link-hover-color: #004999;
   --ictv-panel-header-color: #4aa3df;
   --ictv-primary-color: #007bff;
   --ictv-secondary-color: #6c757d;
   --ictv-success-color: #198754;
   --ictv-warning-color: #ffc107;

   --ictv-border-radius: 5px;
}

/*-------------------------------------------------------------------------------------------------------------------------------------------------
   General-purpose styles
-------------------------------------------------------------------------------------------------------------------------------------------------*/

#taxonomy_browser_container [data-is-visible='true'] {
   display: initial;
}

#taxonomy_browser_container [data-is-visible='false'] {
   display: none;
}


/* The spinner icon and text */
#taxonomy_browser_container .spinner-ctrl {
   align-items: center;
   display: flex;
   flex-flow: row nowrap;
   font-size: 1.0rem;
   justify-content: flex-start;
   width: 100%;
}

#taxonomy_browser_container .spinner-ctrl i {
   font-size: 2.0rem;
   margin-right: 0.5rem;
}

#taxonomy_browser_container .btn {
   border: 1px solid transparent;
   display: inline-block;
   font-size: 12pt;
   font-size: 0.9rem;
   font-weight: 400;
   padding: .375rem .75rem;
   text-align: center;
   user-select: none;
   vertical-align: middle;
   white-space: nowrap;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
}

#taxonomy_browser_container .btn i {
   margin-right: 5px;
}

/* Hide or display/reveal an element using animation. */
#taxonomy_browser_container .hide-transition {
  overflow: hidden;
  opacity: 0;
  max-height: 0;
  margin-top: 0;
  margin-bottom: 0;
  padding-top: 0;
  padding-bottom: 0;
  transition: opacity 300ms ease, max-height 300ms ease, margin 300ms ease, padding 300ms ease;
}
#taxonomy_browser_container .show-transition {
  transition: opacity 300ms ease, height 300ms ease, margin 300ms ease, padding 300ms ease;
  overflow: hidden;
  opacity: 0;
  height: 0;
  margin-top: 0;
  margin-bottom: 0;
  padding-top: 0;
  padding-bottom: 0;
}



/*-------------------------------------------------------------------------------------------------------------------------------------------------
    Buttons styles from Bootstrap
-------------------------------------------------------------------------------------------------------------------------------------------------*/

/* Primary */
#taxonomy_browser_container .btn-primary {
   color: #fff;
   background-color: #007bff;
   border-color: #007bff;
}

#taxonomy_browser_container .btn-primary:hover {
   color: #fff;
   background-color: #0069d9;
   border-color: #0062cc;
}

#taxonomy_browser_container .btn-primary:focus,
#taxonomy_browser_container .btn-primary.focus {
   box-shadow: 0 0 0 0.2rem rgba(38, 143, 255, 0.5);
}

#taxonomy_browser_container .btn-primary.disabled,
#taxonomy_browser_container .btn-primary:disabled {
   color: #fff;
   background-color: #007bff;
   border-color: #007bff;
}

/* Success */
#taxonomy_browser_container .btn-success {
   color: #fff;
   background-color: #28a745;
   border-color: #28a745;
}

#taxonomy_browser_container .btn-success:hover {
   color: #fff;
   background-color: #218838;
   border-color: #1e7e34;
}

#taxonomy_browser_container .btn-success:focus,
#taxonomy_browser_container .btn-success.focus {
   box-shadow: 0 0 0 0.2rem rgba(72, 180, 97, 0.5);
}

#taxonomy_browser_container .btn-success.disabled,
#taxonomy_browser_container .btn-success:disabled {
   color: #fff;
   background-color: #28a745;
   border-color: #28a745;
}

/* Warning */
#taxonomy_browser_container .btn-warning {
   color: #212529;
   background-color: #ffc107;
   border-color: #ffc107;
}

#taxonomy_browser_container .btn-warning:hover {
   color: #212529;
   background-color: #e0a800;
   border-color: #d39e00;
}

#taxonomy_browser_container .btn-warning:focus,
#taxonomy_browser_container .btn-warning.focus {
   box-shadow: 0 0 0 0.2rem rgba(222, 170, 12, 0.5);
}

#taxonomy_browser_container .btn-warning.disabled,
#taxonomy_browser_container .btn-warning:disabled {
   color: #212529;
   background-color: #ffc107;
   border-color: #ffc107;
}




/* The "Show ___ entries" row above the table */
#taxonomy_browser_container .dt-container .dt-length {
   margin-bottom: 1.0rem;
}

#taxonomy_browser_container .dt-container .dt-length label {
   display: inline-block !important;
}

#taxonomy_browser_container .dt-container .dt-length select.dt-input {
   background-color: transparent;
   border: 1px solid var(--ictv-border-color);
   border-radius: 3px;
   font-size: 1.0rem;
   max-width: 6rem;
   margin: 0 0.25rem;
   min-width: 4rem;
   padding: 0 5px !important;
   text-align: left;
}

#taxonomy_browser_container .dt-container .dt-layout-row {
   font-size: 0.9rem;
}

#taxonomy_browser_container .dt-container .dt-paging {
   text-align: right;
}




/*-------------------------------------------------------------------------------------------------------------------------------------------------
   Taxonomy browser
-------------------------------------------------------------------------------------------------------------------------------------------------*/

/* All taxon node containers */
#taxonomy_browser_container .taxonomy-browser .tc-container {
   font-size: 11pt;
}

#taxonomy_browser_container .taxonomy-browser .tc-container.small-font {
   font-size: 9pt;
}

/* A taxon node container below the top level */
#taxonomy_browser_container .taxonomy-browser .tc-container.left-offset {
   margin-left: 23px;
}

/* A taxon node */
#taxonomy_browser_container .taxonomy-browser .tc-node {
   align-items: center;
   border-radius: 5px;
   display: flex;
   flex-flow: row nowrap;
   justify-content: space-between;
   margin-bottom: 3px;
}

#taxonomy_browser_container .taxonomy-browser .tc-node .tc-left-side {
   align-items: center;
   display: flex;
   flex-flow: row nowrap;
   justify-content: flex-start;
   margin: 0;
   padding: 3px 5px;
}

#taxonomy_browser_container .taxonomy-browser .tc-node .tc-member-of {
   margin-left: 15px;
   opacity: 60%;
   text-transform: capitalize;
}

/* The star that's displayed on the reference strain */
#taxonomy_browser_container .taxonomy-browser .tc-ref-species {
   display: inline-block;
   height: 100%;
   position: absolute;
   margin: 0 0 0 -30px;
   padding: 0;
   vertical-align: middle;
}

#taxonomy_browser_container .taxonomy-browser .tc-ref-species .fas.fa-star {
   color: #ffc90e;
   font-size: 12pt;
   left: 0.3rem;
   margin: 0;
   padding: 0;
   position: absolute;
   top: 0.25rem;
   vertical-align: middle;
}

#taxonomy_browser_container .taxonomy-browser .tc-ctrl {
   cursor: pointer;
   width: 20px;
}

#taxonomy_browser_container .taxonomy-browser .tc-rank {
   font-weight: 700;
   margin-right: 5px;
   text-transform: capitalize;
}

#taxonomy_browser_container .taxonomy-browser .tc-count {
   text-align: right;
}

#taxonomy_browser_container .taxonomy-browser .tc-right-side {
   align-items: center;
   display: flex;
   flex-flow: row nowrap;
   justify-content: flex-end;
   padding: 3px 5px;
   width: 160px;
}

#taxonomy_browser_container .taxonomy-browser .tc-node .tc-right-side .reveal-on-hover {
   display: none;
   margin-right: 1.0rem;
   white-space: nowrap;
}

#taxonomy_browser_container .taxonomy-browser .tc-node:hover .tc-right-side .reveal-on-hover {
   display: block;
}

/*#taxonomy_browser_container .taxonomy-browser .tc-right-side i {
    margin-right: 0.5rem;
    opacity: 60%;
}*/
#taxonomy_browser_container .taxonomy-browser .tc-right-side .updated {
   font-size: 0.9rem;
   margin-right: 1.0rem;
   opacity: 60%;
}

/*
#taxonomy_browser_container .taxonomy-browser .tc-right-side .fa-info-circle {
    opacity: 60%;
}*/

#taxonomy_browser_container .taxonomy-browser .tc-children[data-is-expanded="true"] {
   display: block;
}

#taxonomy_browser_container .taxonomy-browser .tc-children[data-is-expanded="false"] {
   display: none;
}


/* Realm */
#taxonomy_browser_container .taxonomy-browser .tc-node[data-rank='realm'] {
   background-color: #006600;
   color: #fff;
}

/* Subrealm */
#taxonomy_browser_container .taxonomy-browser .tc-node[data-rank='subrealm'] {
   background-color: #006600;
   color: #fff;
}

/* Kingdom */
#taxonomy_browser_container .taxonomy-browser .tc-node[data-rank='kingdom'] {
   background-color: #278627;
   color: #fff;
}

/* Subkingdom */
#taxonomy_browser_container .taxonomy-browser .tc-node[data-rank='subkingdom'] {
   background-color: #278627;
   color: #fff;
}

/* Phylum */
#taxonomy_browser_container .taxonomy-browser .tc-node[data-rank='phylum'] {
   background-color: #00426D;
   color: #fff;
}

/* Subphylum */
#taxonomy_browser_container .taxonomy-browser .tc-node[data-rank='subphylum'] {
   background-color: #00426D;
   color: #fff;
}

/* Class */
#taxonomy_browser_container .taxonomy-browser .tc-node[data-rank='class'] {
   background-color: #3D79AA;
   color: #f6f6f6;
}

/* Subclass */
#taxonomy_browser_container .taxonomy-browser .tc-node[data-rank='subclass'] {
   background-color: #3D79AA;
   color: #f6f6f6;
}

/* Order */
#taxonomy_browser_container .taxonomy-browser .tc-node[data-rank='order'] {
   background-color: #006CB5;
   color: #fff;
}

/* Suborder */
#taxonomy_browser_container .taxonomy-browser .tc-node[data-rank='suborder'] {
   background-color: #006CB5;
   color: #fff;
}

/* Family */
#taxonomy_browser_container .taxonomy-browser .tc-node[data-rank='family'] {
   background-color: #258DE4;
   color: #fff;
}

/* Subfamily */
#taxonomy_browser_container .taxonomy-browser .tc-node[data-rank='subfamily'] {
   background-color: #258DE4;
   color: #fff;
}

/* Genus */
#taxonomy_browser_container .taxonomy-browser .tc-node[data-rank='genus'] {
   background-color: #99D7FF;
   color: #000;
}

/* Subgenus */
#taxonomy_browser_container .taxonomy-browser .tc-node[data-rank='subgenus'] {
   background-color: #548EC0;
   color: #fff;
}

/* Species */
#taxonomy_browser_container .taxonomy-browser .tc-node[data-rank='species'] {
   background-color: #D1EDFF;
   color: #000;
}

#taxonomy_browser_container .taxonomy-browser .tc-history-ctrl {
   cursor: pointer;
   display: inline-block;
   margin-left: 30px;
   text-decoration: underline;
}

#taxonomy_browser_container .taxonomy-browser .tc-history-ctrl.history-available {
   color: #3de545;
}

#taxonomy_browser_container .taxonomy-browser .tc-node.highlighted-node {
   background-color: #ffc90e;
   color: #000;
}

#taxonomy_browser_container .taxonomy-browser .tc-node:hover {
   background-color: #ffc90e;
   color: #000;
   cursor: pointer;
}

#taxonomy_browser_container .taxonomy-browser .taxonomy-tool-tip {
   background: #646464;
   border-radius: 4px;
   color: #ffc64a;
   font-family: arial;
   font-size: 12px;
   padding: 6px 12px;
   position: absolute;
   text-shadow: 0px 1px 1px #000;
}

#taxonomy_browser_container .taxonomy-browser .taxonomy-tool-tip .hidden {
   display: none;
}

#taxonomy_browser_container .taxonomy-browser .taxonomy-tool-tip .visible {
   display: block;
}

#taxonomy_browser_container .taxonomy-browser .taxonomy-tool-tip:before {
   content: " ";
   width: 0;
   height: 0;
   border-left: 10px solid transparent;
   border-right: 10px solid transparent;
   border-top: 10px solid #646464;
   position: absolute;
   bottom: -5px;
   left: 5px;
}


/* Rank controls */
#taxonomy_browser_container .rank-controls-container {
   align-items: center;
   display: flex;
   flex-flow: row nowrap;
   justify-content: flex-start;
   margin-bottom: 1.0rem;
   width: 100%;
}

#taxonomy_browser_container .rank-controls-container .rank-control {
   align-items: center;
   display: flex;
   flex-flow: row nowrap;
   justify-content: flex-start;
   margin-right: 1.0rem;
}

#taxonomy_browser_container .rank-controls-container .rank-control label {
   font-weight: normal;
   margin-right: 0.25rem;
   white-space: nowrap;
}

#taxonomy_browser_container .rank-controls-container .rank-control select {
   border-radius: 0 !important;
   font-size: 0.9rem;
   padding: 0.25rem !important;
   -moz-border-radius: 0 !important;
   -webkit-border-radius: 0 !important;
}

/*#taxonomy_browser_container .rank-controls-container .hide-above-rank-control {
}
#taxonomy_browser_container .rank-controls-container .pre-expand-to-rank-ctrl {
}*/

#taxonomy_browser_container .rank-controls-container .filter-ranks-control {
   background-color: #0062cc;
   border-color: #005cbf;
   border-radius: 0.25rem;
   color: #fff;
}



/*-------------------------------------------------------------------------------------------------------------------------------------------------
    Taxonomy browser: Release panel
-------------------------------------------------------------------------------------------------------------------------------------------------*/
#taxonomy_browser_container .release-panel {
   margin: 30px 0 15px 0;
}

#taxonomy_browser_container .release-panel .release-title {
   color: #515151;
   font-size: 14pt;
   font-weight: 700;
   margin: 0 0 5px 0;
   padding: 10px 0 0 0;
}

#taxonomy_browser_container .release-panel .release-description {
   color: #515151;
   font-size: 10pt;
   font-weight: normal;
   line-height: 15pt;
   margin: 0 0 0 0;
   padding: 0;
}

#taxonomy_browser_container .release-panel .release-taxa-stats {
   color: #515151;
   font-size: 10pt;
   font-weight: normal;
   line-height: 15pt;
   margin: 0 0 15px 0;
   padding: 0;
}

/*-------------------------------------------------------------------------------------------------------------------------------------------------
   Taxonomy browser: search panel and results
-------------------------------------------------------------------------------------------------------------------------------------------------*/

/* The search panel and controls */
#taxonomy_browser_container .search-panel .search-controls {
   align-content: flex-start;
   border-collapse: separate;
   display: flex;
   flex-flow: row nowrap;
   justify-content: flex-start;
   line-height: 1.5;
   margin: 0;
   max-width: 600px;
}

#taxonomy_browser_container .search-panel .search-controls .search-text {
   background-color: #fff;
   background-image: none;
   border: 1px solid #ccc;
   border-radius: 4px 0 0 4px;
   box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
   color: #555;
   font-size: 14px;
   line-height: 1.3;
   margin: 0;
   padding: 0.5rem 2.0rem 0.5rem 0.5rem;  /*6px 12px;*/
   vertical-align: middle;
   width: 345px;
}
#taxonomy_browser_container .search-panel .search-controls .clear {
  position: absolute;
  right: 4px;
  top: 50%;
  transform: translateY(-50%);
  border: none;
  background: transparent;
  font-size: 1.1rem;
  line-height: 1;
  cursor: pointer;
  padding: 0 6px;
  display: none; /* shown only when there's content */
}
#taxonomy_browser_container .search-panel .search-controls input:not(:placeholder-shown) + .clear,
#taxonomy_browser_container .search-panel .search-controls input[data-has-value="true"] + .clear {
  display: inline-block;
}

#taxonomy_browser_container .search-panel .search-controls .search-text:focus {
   color: #495057;
   background-color: #fff;
   border-color: #80bdff;
   outline: 0;
   box-shadow: 0 0 0 1px rgba(0, 123, 255, .15);
}

#taxonomy_browser_container .search-panel .search-controls .search-ctrl {
   background-color: #0062cc;
   border-color: #005cbf;
   border-radius: 0;
   color: #fff;
   cursor: pointer;
}

#taxonomy_browser_container .search-panel .search-controls .clear-search-ctrl {
   background-color: #999;
   border-radius: 0 .25rem .25rem 0;
   color: #fff;
   cursor: pointer;
}

#taxonomy_browser_container .search-controls .search-status {
   height: 100%;
   vertical-align: middle;
}

#taxonomy_browser_container .all-releases-row {
   align-items: center;
   display: flex;
   flex-flow: row nowrap;
   justify-content: flex-start;
   margin: 0.5rem 0 0 0;
}

#taxonomy_browser_container .search-panel .all-releases-row input[type='checkbox'].all-releases-ctrl {
   height: 1.0rem;
   margin-right: 0.25rem;
   width: 1.0rem;
}

#taxonomy_browser_container .all-releases-row label {
   font-size: 11pt;
   font-weight: normal;
   margin-bottom: 0 !important;
}


/* Search results */
#taxonomy_browser_container .search-panel .search-results {
   margin: 15px 0 15px 0;
}

#taxonomy_browser_container .search-results-table {
   margin: 15px 0 0 0;
}

#taxonomy_browser_container .search-results-table tr.header-row {
   background-color: var(--ictv-grey-color) /* #757575 */ !important;
}

#taxonomy_browser_container .search-results-table tr.header-row th {
   background-color: var(--ictv-grey-color) /* #757575 */ !important;
   border-left-width: 0 !important;
   border-right-width: 0 !important;
   color: #fff !important;
   font-size: 0.9rem !important;
   padding-left: 0.5rem;
   text-align: left !important;
}

#taxonomy_browser_container .search-results-table .even-row {
   background-color: #fff;
}
#taxonomy_browser_container .search-results-table .odd-row {
   background-color: var(--ictv-alt-row-bg);
}
#taxonomy_browser_container .search-results-table tr:hover[data-id] {
   background-color: var(--ictv-warning-color); /* #ffc90e; */
   cursor: pointer;
}

#taxonomy_browser_container .search-results-table .controls {
   width: fit-content;
}

#taxonomy_browser_container .search-results-table .view-ctrl-column {
   /*vertical-align: middle;*/
   white-space: nowrap; /* Keep buttons on one line. */
   width: 1%; /* Let table auto-size this column to content. */
}
#taxonomy_browser_container .search-results-table .view-ctrl-column > button {
   border-color: var(--ictv-border-color);
   border-style: solid;
   border-width: 1px;
   cursor: pointer;
   display: inline-block;
   font-size: 0.75rem;
   font-weight: 400;
   text-align: center;
   user-select: none;
   vertical-align: middle;
   white-space: normal; /* Allow button text to wrap inside, if needed. */
}
#taxonomy_browser_container .search-results-table .view-ctrl-column .view-search-result-button {
   margin-right: 0.2rem;
}

#taxonomy_browser_container .search-results-table td {
   font-size: 0.9rem;
   padding: 0.5rem;
   vertical-align: top;
}

#taxonomy_browser_container .search-results-table .release-name {
   text-align: left;
   width: 70px;
}

#taxonomy_browser_container .search-results-table .level-name {
   text-align: left;
   text-transform: capitalize;
   width: 56px;
}

#taxonomy_browser_container .search-term-result {
   background-color: #ffc90e;
}

/* "No results" from the search panel */
#taxonomy_browser_container div:where(.swal2-container) .swal2-html-container .no-results-list {
   list-style-position: outside;
   text-align: left !important;
}

#taxonomy_browser_container div:where(.swal2-container) .swal2-html-container .no-results-list li {
   margin-bottom: 0.9rem;
   text-align: left;
}

#taxonomy_browser_container div:where(.swal2-container) button:where(.swal2-styled).swal2-confirm {
   background-color: #28a745 !important;
}



/*-------------------------------------------------------------------------------------------------------------------------------------------------
    Overriding DataTables CSS
-------------------------------------------------------------------------------------------------------------------------------------------------*/
/* The "Showing x of y entries" text */
#taxonomy_browser_container .dt-info {
   font-size: 0.8rem;
}

/* The "Show ___ entries" row above the table */
#taxonomy_browser_container .dt-length {
   display: flex;
   flex-flow: row nowrap;
   margin-bottom: 1.0rem;
}
#taxonomy_browser_container .dt-length label {
   align-items: center;
   font-weight: normal;
   display: flex !important;
   flex-flow: row nowrap !important;
   justify-content: flex-start;
}
#taxonomy_browser_container .dt-length select.dt-input {
   border: 1px solid var(--ictv-border-color);
   border-radius: 5px;
   display: inline-block;
   font-size: 0.8rem;
   padding: 3px !important;
   margin: 0 0.25rem;
   text-align: left;
   width: 60px;
}
#taxonomy_browser_container .dt-paging .dt-paging-button {
   border-color: var(--ictv-border-color);
   border-style: solid;
   border-radius: 0;
   border-width: 1px;
   margin-right: 0.25rem;
}
#taxonomy_browser_container .dt-type-numeric {
   padding: 3px 6px;
}