/* KANBOARD PLUGIN - AGILE INDICATORS CSS FILE */
/* Sidebar structure and colour contrast are covered by tests/SidebarMarkupTest.php. */

.agile-indicators-sidebar {
    --agile-indicators-border: #476E9E;
    --agile-indicators-heading: #333333;
    --agile-indicators-text: #111111;
    --agile-indicators-priority-high: #FFE0E0;
    --agile-indicators-priority-medium: #DDF5DD;
    --agile-indicators-priority-low: #FFF0C7;
    --agile-indicators-complexity-low: #F5F59A;
    --agile-indicators-complexity-medium: #FFD0A3;
    --agile-indicators-complexity-high: #FFB3B3;

    list-style: none;
}

/* Keep scale headings readable while following Kanboard's active colour scheme. */
@supports (color: light-dark(#333333, #E6EDF3)) {
    .agile-indicators-sidebar {
        --agile-indicators-heading: light-dark(#333333, #E6EDF3);
    }
}

.agile-indicators-sidebar > hr {
    margin: 15px 0;
}

.agile-indicators-sidebar .agile-indicators-scale {
    width: 100%;
    max-width: 18rem;
    font-size: 1em;
    box-shadow: 1px 1px 3px 0 rgb(71, 110, 158, 0.65);
    margin: 20px auto;
}

.agile-indicators-sidebar .table-list-header {
    color: var(--agile-indicators-heading);
    text-transform: uppercase;
    text-align: center;
    display: block;
    border-color: var(--agile-indicators-border);
    border-radius: 3px 3px 0 0;
    font-size: .9em;
}

.agile-indicators-sidebar .agile-bg-red {
    background-color: var(--agile-indicators-priority-high);
}

.agile-indicators-sidebar .agile-bg-green {
    background-color: var(--agile-indicators-priority-medium);
}

.agile-indicators-sidebar .agile-bg-cream {
    background-color: var(--agile-indicators-priority-low);
}

.agile-indicators-sidebar .agile-table-list-title strong {
    text-align: center;
    display: block;
    color: var(--agile-indicators-text);
}

.agile-indicators-sidebar .agile-indicators-complexities .agile-table-list-details {
    font-size: .8em;
}

.agile-indicators-sidebar .agile-table-list-details {
    font-size: .9em;
    text-align: center;
    color: var(--agile-indicators-text);
}

.agile-indicators-sidebar .agile-table-list-details ul li {
    display: list-item;
}

.agile-indicators-sidebar .agile-indicators-complexity-gradient {
    background: linear-gradient(
        to bottom,
        var(--agile-indicators-complexity-low) 0%,
        var(--agile-indicators-complexity-medium) 50%,
        var(--agile-indicators-complexity-high) 100%
    );
    border-radius: 0 0 3px 3px;
}

.agile-indicators-sidebar .agile-row {
    padding: 10px 3px 7px 3px;
    border-bottom: 1px solid var(--agile-indicators-border);
    border-right: 1px solid var(--agile-indicators-border);
    border-left: 1px solid var(--agile-indicators-border);
    position: relative;
}

.agile-indicators-sidebar .agile-row .table-list-details {
    color: var(--agile-indicators-text);
    font-weight: normal;
    margin-top: 5px;
    line-height: 20px;
}

.agile-indicators-sidebar .agile-row .table-list-details li {
    list-style-type: none;
}

.agile-indicators-sidebar .agile-row:last-child {
    border-radius: 0 0 3px 3px;
}