@import url('https://fonts.googleapis.com/css2?family=Roboto+Mono:wght@100;400;500&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;1,100;1,300;1,400;1,500&display=swap');

/* GENERAL */
* {
    box-sizing: border-box;
}

:root {
    font-size: 12px;
    font-family: 'Roboto', sans-serif;

    --main-color: #263f6a;
    --main-color-bright: #d4d9e1;
    --secondary-color: #fff;
    --main-color-low-opacity: rgba(38, 63, 106, .2);
    --main-color-med-opacity: rgba(38, 63, 106, .3);
    --dark-text-color: #111;

    /* Add the six corporate colors */
    --primary-color-1: #263f6a;
    --primary-inverse-1: #fff;
    --primary-color-2: #82786F;
    --primary-inverse-2: #fff;
    --primary-color-3: #D52B1E;
    --primary-inverse-3: #111;

    --secondary-color-1: #00A1DE;
    --secondary-color-low-opacity: rgba(0, 161, 222, .4);
    --secondary-inverse-1: #111;
    --secondary-color-2: #111;
    --secondary-inverse-2: #fff;
    --secondary-color-3: #D5D2CA;
    --secondary-inverse-3: #111;
}

.urgent {
    color: #ff0000;
    font-weight: bold;
}

.low-priority {
    background-color: #FFFEAB;
}

.normal-priority {
    background-color: #ABDDFF;
}

.high-priority {
    background-color: #FF9A5C;
}

.urgent-priority {
    background-color: #FF6464;
}

.warning-text {
    color: #D52B1E;
}

.warning {
    font-style: italic;
    background-color: yellow;
}

.pass {
    font-weight: bold;
    color: green;
}

.fail {
    font-weight: bold;
    color: var(--primary-color-3);
}

.optional_missing {
    font-style: oblique;
    color: Goldenrod;
}

.optional {
    font-weight: bold;
    font-style: oblique;
    color: #48c78e;
}

.differentiate {
    color: var(--secondary-color-1);
}

.highlight {
    background-color: rgba(255, 255, 0, .4);
}

.location- {
    background-color: unset;
}
.location-1 {
    background-color: #e1adff;  /* louisville light purple */
    /*background-color: #EBC7EF; */ /* Louisville light pink from SmartSheet expression*/
}

.location-2 {
    background-color: #adbbff; /* san diego light blue */
    /*background-color: #C6E7C8; */ /* San Diego light green from SmartSheet expression */
}

.location-3 {
    background-color: #faa5ab; /* san francisco light red */
}

.location-4 {
    background-color: #FFCD7A; /* remote / Evotec yellow */
}

.location-5 {
    background-color: #93cbd2; /* nyc pale teal */
}

.location-6 {
    background-color: #ffade6; /* nyc pale teal */
}

.tint {
    background-color: rgba(0, 0, 0, .05);
}

.nowrap {
    white-space: nowrap;
}

.bold {
    font-weight: bold;
}

.flash-message.flash-success, label.flash-success,
td.flash-success, table.list-view td.flash-success, table.detail-view td.flash-success
{
    border: 2px solid #48c78e;
    background-color: #ebf9f3;
}

.flash-message.flash-alert, label.flash-alert,
td.flash-alert, table.list-view td.flash-alert, table.detail-view td.flash-alert
{
    border: 2px solid #ffb700;
    background-color: #fff8e6;
}

.flash-message.flash-error, label.flash-error,
td.flash-error, table.list-view td.flash-error, table.detail-view td.flash-error
{
    border: 2px solid #f14668;
    background-color: #fbd0d8;
}

/* TABLES */
th.dthead, td.dthead,
table.list-view th.dthead {
    background-color: var(--main-color);
    color: var(--secondary-color);
    font-weight: 500;
}


/*  Purification Aliquot related stuff  */

/* teal */
.color-c1, tr.color-c1,
table.list-view tr.color-c1, table.detail-view tr.color-c1
{
    background-color: #A0C7C4;
}

/* light blue-green */
.color-c2, tr.color-c2,
table.list-view tr.color-c2, table.detail-view tr.color-c2
{
    background-color: #D7EEF1;
}

/* light purple */
.color-c3, tr.color-c3,
table.list-view tr.color-c3, table.detail-view tr.color-c3
{
    background-color: #DCCBDF;
}

/* orange */
.color-c4, tr.color-c4,
table.list-view tr.color-c4, table.detail-view tr.color-c4
{
    background-color: #F8D3AA;
}

/* yellow */
.color-c5, tr.color-c5,
table.list-view tr.color-c5, table.detail-view tr.color-c5
{
    background-color: #ffffcc;
}

/* light blue */
.color-c6, tr.color-c6,
table.list-view tr.color-c6, table.detail-view tr.color-c6
{
    background-color: #BDD7F0;
}

/* pink */
.color-c7, tr.color-c7,
table.list-view tr.color-c7, table.detail-view tr.color-c7
{
    background-color: #FEE1F2;
}

/* light green */
.color-c8, tr.color-c8,
table.list-view tr.color-c8, table.detail-view tr.color-c8
{
    background-color: #D7F4C9;
}

/* tan */
.color-c9, tr.color-c9,
table.list-view tr.color-c9, table.detail-view tr.color-c9
{
    background-color: #E2D7C8;
}

/* light red-ish */
.color-c10, tr.color-c10,
table.list-view tr.color-c10, table.detail-view tr.color-c10
{
    background-color: #FDBFBF;
}

/* olive */
.color-c-last, tr.color-c-last,
table.list-view tr.color-c-last, table.detail-view tr.color-c-last
{
    background-color: #C1CDBA;
}

table.list-view tr.add-row, table.detail-view tr.add-row
.add-row, .pale-blue {
    background-color: #cae9ff;
}

table#plate-map-table td.well-selected {
    border: 1px solid black;
    background-color: #00ff00;
}

td.well-selectable,
td.well-non-selectable {
    min-width: 50px;
    height: 50px;
    white-space: pre;
    text-align: center;
}

.well-selectable .tooltiptext {
    visibility: hidden;
    background-color: grey;
    color: #fff;
    text-align: center;
    padding: 5px 10px;
    border-radius: 6px;
    position: absolute;
    z-index: 1;
}

.well-selectable:hover .tooltiptext {
    visibility: visible;
}

span.tooltiptext {
	pointer-events: none;
}

.category-header {
    background-color: var(--main-color-bright);
    color: var(--main-color);
    text-align: center;
    font-weight: bold;
}

table#aliquot-rack-legend td.aliq-selected,
table#aliquot-rack-details td.aliq-selected {
    border: 1px solid black;
    background-color: #00ff00;
}

td.aliq-selectable,
td.aliq-non-selectable {
    min-width: 75px;
    height: 50px;
}

.separate {
    padding-top: 24px;
}

.structure_seq_box {
    width: 100%;
    line-height: 125%;
    font-family:Courier New;
    font-size: 14px;
}

.dialog_td_second {
    font-family: Courier New;
}

.protparams-wrapper {
    display: inline-block;
    width: 100%;
}

.protparams-iframe {
    display: inline-block;
    width: 100%;
    height: 1000px;
}