.items-center {
    display: flex;
    justify-content: center;
}

.vertical-center {
    display: flex;
    align-items: center;
}

.annotation-img {
    max-width: 250px;
    max-height: 220px;
    cursor: pointer;
}

.loading {
    max-width: 100px;
    max-height: 100px;
    cursor: wait;
}

#annotation-search {
    min-height: 40px;
    max-height: 40px;
}

.choices__input.choices__input--cloned {
    float: left;
}

.choices__inner {
    display: flex !important;
    min-height: 34px !important;
}

.choices__list--multiple {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: flex-start !important;
    gap: 3px;
}

#annotation-table {
    font-size: 16px;
}

.annotation-table thead tr th {
    text-align: center;
}

.annotation-img {
    margin: auto;
}

#table-filters {
    text-align: center;
}

.choices {
    width: 100% !important;
}

.annotation-table-column-filters {
    display: flex;
    gap: 10px;
    justify-content: center;
    padding-top: 20px;
    padding-bottom: 20px;
}

.column-filter-container {
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.page-number {
    font-size: 15px;
    margin-right: 5px;
}

.p-link {
    font-size: 15px;
}

.annotation-table-pagination {
    display: flex;
    justify-content: center;
}

.annotation-tag {
    background-color: #e4e5e5;
    color: #515c66;
    border-radius: 16px;
    padding: 0 0.5rem;
    margin: 0.3rem;
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
}

.loadingWheel {
    position: fixed;
    left: 50%;
    top: 60%;
    transform: translate(-50%, -50%);
    text-align: center;
    z-index: 9999;
    display: none;
}

.spinner {
    display: inline-block;
    border: 16px solid lightgray;
    border-radius: 50%;
    border-top: 16px solid #3498db;
    width: 90px;
    height: 90px;
    animation: spin 2s linear infinite;
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

ul > li:before {
    display: none !important;
}

#annotation-pagination {
    display: flex;
    justify-content: center;
}

.icon {
    display: inline-block;
    margin: 0;
    padding: 0;
    width: 22px;
    height: 22px;
    background-size: contain !important;
}

.icon-arrow-left-dark {
    background: url('data:image/svg+xml;utf8,<svg width="10" height="18" viewBox="0 0 10 18" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M9 1L1 9L9 17" stroke-width="1.3px" stroke="%23000000"/></svg>')
        no-repeat center center;
}

.icon-arrow-right-dark {
    background: url('data:image/svg+xml;utf8,<svg width="10" height="18" viewBox="0 0 10 18" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1 17L9 9L0.999999 1" stroke-width="1.3px" stroke="%23000000"/></svg>')
        no-repeat center center;
}

.highlight {
    font-weight: bold;
    background-color: transparent; /* keep it clean */
}

.match-row {
    background-color: #e0fce0 !important;
}

.highlighted-annotation-row {
    background-color: #ffe58f !important;
}

.cssCircle {
    -webkit-border-radius: 999px;
    -moz-border-radius: 999px;
    border-radius: 999px;
    behavior: url(PIE.htc);

    width: 15px;
    height: 15px;
    padding: 0px;

    background: white;
    border: 1px solid black;
    color: #003580;
    text-align: center;
    -webkit-transition: background 0.2s linear;
    -moz-transition: background 0.2s linear;
    -ms-transition: background 0.2s linear;
    -o-transition: background 0.2s linear;
    transition: background 0.2s linear;
    transition: color 0.2s linear;

    font: 13px Arial, sans-serif;
}

.minusSign {
    line-height: 0.9em;
    margin-bottom: 1px;
}

.plusSign {
    line-height: 1.1em;
}

#annotation-search-table-container{
    overflow: auto;
    width: 100%;
    max-height: 400px;
    border: 1px solid black;
    margin-bottom: 20px;
}