body {
    position: relative;
}

/* hide django comments honeypot */
#id_honeypot {
    display: none;
}

/* comments - show icon on my comment */
#comments dt.current-user:before {
    /* position: absolute; */
    /* top: 0; */
    /* left: 10px; */
    position: relative;
    top: 2px;
    vertical-align: baseline;
    font-family: bootstrap-icons !important;
    content: "\F4E1";
    letter-spacing: 3px;
    color: #0d6efd;
    font-weight: normal !important;
    white-space: pre;
}


/* django tables 2 orderable: add arrows */
/* note that the color is hardcoded */
th.orderable>a:after {
    /* position: absolute; */
    /* top: 0; */
    /* left: 10px; */
    position: relative;
    top: 2px;
    vertical-align: baseline;
    font-family: bootstrap-icons !important;
    content: "\A \F126 \F147";
    letter-spacing: 3px;
    color: #0d6efd;
    font-weight: normal !important;
    white-space: pre;
}

th.desc>a:after {
    content: "\A \F125 \F147" !important;
}

th.asc>a:after {
    content: "\A \F126 \F146" !important;
}

/* form.employee_evaluation legend {
    font-size: 200% !important;
} */

.ta-comment {
    height: 5em;
}


.form-flex>* {
    margin: 3px;
}

.flex-break {
    flex-basis: 100%;
    width: 0;
}

.card-body>.badge {
    float: right;
}

.card-body>i {
    float: right;
    font-size: 1.3rem;
}

.card-title {
    font-size: calc(1.275rem + .3vw);
}

.card-profile {}


.card-color-red {
    box-shadow:
        -2px -2px 2px red,
        1px 1px 2px red !important;
}

.card-color-red .icon-container {
    color: red
}

.card-color-blue {
    box-shadow:
        -2px -2px 2px #0d6efd,
        1px 1px 2px #0d6efd !important;
}

.card-color-blue .icon-container {
    color: #0d6efd;
}

.card-color-green {
    box-shadow:
        -2px -2px 2px #198754,
        1px 1px 2px #198754 !important;
}

.card-color-green .icon-container {
    color: #198754;
}

.card-color-yellow {
    box-shadow:
        -2px -2px 2px #ffc107,
        1px 1px 2px #ffc107 !important;
}

.card-color-yellow .icon-container {
    color: #ffc107;
}

.card-color-magenta {
    box-shadow:
        -2px -2px 2px #e83e8c,
        1px 1px 2px #e83e8c !important;
}

.card-color-magenta .icon-container {
    color: #e83e8c;
}

.card-color-cyan {
    box-shadow:
        -2px -2px 2px #0dcaf0,
        1px 1px 2px #0dcaf0 !important;
}

.card-color-cyan .icon-container {
    color: #0dcaf0;
}

.card-color-light-blue {
    box-shadow:
        -2px -2px 2px #0d6efd,
        1px 1px 2px #0d6efd !important;
}

.card-color-light-blue .icon-container {
    color: #2e9eff;
}

a.form-help {
    float: right;
}

.form-text {
    margin-top: 0;
}

/* Fieldset styling */
fieldset {
    border: 1px solid #aaa;
    /* Color of the border */
    border-radius: 5px;
    /* Rounded corners */
    padding: 1rem 1.5rem;
    /* Space inside the fieldset */
    margin: 2rem 0;
    /* Space outside the fieldset, 2rem on top and bottom, none on the sides */
    position: relative;
    /* To position the legend correctly */
}

/* Legend styling */
fieldset legend {
    background-color: #fff;
    /* Same as page background, creating an illusion that the legend is cut-out */
    font-weight: bold;
    /* Bold font for the legend */
}

/* Label styling (specifically for textareas) */
fieldset div label {
    /* This selector will target labels for elements containing "textarea" in their "for" attribute */
    font-weight: bold;
    /* Bold font for label */
    margin-bottom: 0.5rem;
    /* Space below the label */
    color: #333;
    padding: 5px 0;
    /* Slightly darker color for better readability */
}

table#compare_table td {
    min-width: 400px;
    vertical-align: top;
}

/*
 * REPORT
 */
.badge {
    font-weight: bold;
    text-align: center;
    margin: 2px;
}

.quartiles-D1,
.conference-Astar {
    background-color: #009688;
    /* Teal color for the best rating */
}

.quartiles-Q1,
.conference-A {
    background-color: #4CAF50;
    /* Green color for the great rating */
}

.quartiles-Q2,
.conference-B {
    background-color: #FFC107;
    /* Amber color for the very good rating */
}

.quartiles-Q3,
.conference-C {
    background-color: #FF9800;
    /* Orange color for the OK rating */
}

.quartiles-Q4 {
    background-color: #F44336;
    /* Red color for the not so good rating */
}

.conference-F {
    background-color: red;
}

.conference-D {
    background-color: #007bff;
}

.quartiles-none,
.conference-N {
    background-color: #9E9E9E;
    /* Grey color for missing data */
    color: #FFFFFF;
}

.bobr-data {
    background-color: #607D8B;
    /* Blue Grey color for neutral info */
    color: #FFFFFF;
}

.pub-result {
    border: 1px solid #e5e5e5;
    padding: 10px;
    margin-bottom: 10px;
    border-radius: 5px;
}

.pub-text {
    margin-bottom: 5px;
}


.authors {
    color: #555;
}


.title {
    color: #333;
}

.pub-data {
    margin-bottom: 10px;
}

.badge {
    margin-right: 2px;
    padding: 4px 8px;
}

.pub-links a {
    color: #007bff;
    margin-right: 5px;
    text-decoration: none;
}

.pub-links a:hover {
    text-decoration: underline;
}


span.almost-invisible {
    color: #DDDDDD;
}

.flag {
    background-size: contain;
    background-position: 50%;
    background-repeat: no-repeat;
    position: relative;
    display: inline-block;
    width: 1em;
    line-height: 0.75em
}

.flag-dropdown {
    background-size: 1em 0.75em;
    background-position: 0%;
    background-repeat: no-repeat;
    vertical-align: middle;
    padding-left: 1.2em;
    margin-left: 0.2em;
}

.flag:before {
    content: "\00a0"
}

.flag-en {
    background-image: url(/static/images/flags/gb.svg)
}

.flag-cs {
    background-image: url(/static/images/flags/cz.svg)
}

/*
 * EVALUATION STATUS
 */

.evaluation-status {
    margin-top: 1px;
    padding: 5px 10px;
    color: #ffffff;
    /* White text color */
    display: inline-block;
    background-color: #999999;
}

.es-BEFORE_OPEN {
    background-color: #d0d0d0;
    /* Light grey - Inactive */
}

.es-OPEN_CLOSED,
.es-OPEN_FOR_STUDENT {
    background-color: #4a90e2;
    /* Medium blue - Open for evaluatee only */
}

.es-CLOSED_OPEN,
.es-OPEN_FOR_ADVISOR {
    background-color: #20B2AA;
    /* LightSeaGreen */
}

.es-OPEN_OPEN,
.es-OPEN_FOR_HEAD {
    background-color: #2f00ff;
    /* Bright blue - Open for both */
}

.es-SENT_WAITING,
.es-IN_REVIEW {
    background-color: #9ACD32;
    /* YellowGreen - Filled in by the evaluator and waiting */
}

.es-SENT_COMMENTED,
.es-OPEN_FOR_BOARD {
    background-color: #32CD32;
    /* LimeGreen - Commented by the evaluatee */
}


.es-RETURNED_TO_ADVISOR,
.es-RETURNED_TO_ALL {
    background-color: #993333;
}

.es-WAITING_FOR_DECISION {
    background-color: #606670;
    /* Tomato - Waiting for decision */
}

.es-CLOSED {
    background-color: #006400;
    /* DarkGreen - Finished */
}


.form-inline>* {
    display: block;
    width: auto;
    float: left;
    padding: 5px;
    border: 1px solid gray;
    border-radius: 4px;
    margin-right: 10px;
    margin-bottom: 10px;
}

.form-inline::after {
    display: block;
    clear: both;
    content: "";
}

.form-inline .multiselect-selected-text {
    max-width: 200px;
    display: inline-block;
    text-wrap: wrap;
}

.form-inline>div>label {
    vertical-align: top;
}

.note-below {
    font-size: 0.9rem;
    color: #666666;
    margin-top: 4px;
    font-style: italic;
    position: relative;
    padding-left: 1.5rem;
}

.note-below::before {
    content: "\F10D";
    font-family: bootstrap-icons !important;
    position: absolute;
    left: 0;
    top: 0;
    color: #666666;
    font-size: 1rem;
}

.goal-closed {
    background-color: #bdfec3;
    border: 1px solid #57ff84;
}

.goal-ongoing {
    background-color: #d2f4ff;
    border: 1px solid #ffec57;
}

.goal-ongoing:hover {
    background-color: #b6e8ff;
}

.goal-completed {
    background-color: #d9ffee;
    border: 1px solid #a1a1a1;
}

.goal-completed:hover {
    background-color: #bff2c6;
}

.goal-not_completed {
    background-color: rgba(255, 0, 0, 0.4);
    border: 1px solid rgba(255, 0, 0, 0.7);
}

.goal-not_completed:hover {
    background-color: rgba(255, 0, 0, 0.6);
}

.goal-removed {
    background-color: rgba(155, 155, 155, 0.7);
    border: 1px solid rgba(55, 55, 55, 0.5);
}

.goal-removed:hover {
    background-color: rgba(155, 155, 155, 0.9);
}

.goal-new {
    background-color: #fff4d2;
    border: 1px solid #ffd657;
}

.goal-new:hover {
    background-color: #ffeaa3;
}

.row-goal-form {
    border-bottom: 2px solid #ccc;
}

.nav-sub {
    color: black;
}

#nav-left .nav-link {
    padding-top: 1px;
    padding-bottom: 1px;
}

.nav-item .active {
    background-color: #0d6efd;
    color: white;
}

label~.invalid-feedback {
    display: block;
}

.smaller {
    font-size: 90%;
}

.flex-break {
    flex-basis: 100%;
    height: 0;
}

/* Chrome, Safari, Edge, Opera */
input.no-arrows::-webkit-outer-spin-button,
input.no-arrows::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Firefox */
input.no-arrows {
    -moz-appearance: textfield;
}

.multiselect-delimiter {
    border-right: 3px solid white;
    margin: 0 3px 0 3px;
}

.context-menu-icon-1::before {
    content: "\F797" !important;
    font-family: bootstrap-icons !important;
}

.context-menu-icon-2::before {
    content: "\F79D" !important;
    font-family: bootstrap-icons !important;
}

.context-menu-icon-3::before {
    content: "\F7A3" !important;
    font-family: bootstrap-icons !important;
}

.context-menu-icon-4::before {
    content: "\F7A9" !important;
    font-family: bootstrap-icons !important;
}

.context-menu-icon-5::before {
    content: "\F7AF" !important;
    font-family: bootstrap-icons !important;
}

.context-menu-icon-6::before {
    content: "\F7B5" !important;
    font-family: bootstrap-icons !important;
}

.contextmenu-share {
    /* width: 31px !important; */
    min-width: 30px !important;
    display: flex;
}

.contextmenu-share>li {
    padding: 0px 6px 0px 22px !important;
    flex: auto;
}

.contextmenu-share>li::before {
    padding-right: 6px;
}