/*
 * Missions et temps : jauge du budget, histogramme passé / facturé.
 * Lié par base.html.twig.
 */

.gp-jauge {
    height: 0.5rem;
    margin: 0.375rem 0 0.25rem;
    border-radius: 999px;
    background: var(--gp-fond-creux);
    overflow: hidden;
}

.gp-jauge__barre {
    height: 100%;
    border-radius: inherit;
    background: var(--gp-bleu-chantier);
}

.gp-jauge--alerte .gp-jauge__barre { background: var(--gp-ambre); }
.gp-jauge--depasse .gp-jauge__barre { background: var(--gp-rouge); }

.gp-texte-alerte { color: var(--gp-ambre); font-weight: 600; }

.gp-mission-carte .gp-ref-carte__detail { margin-bottom: 0; }

.gp-histogramme {
    display: flex;
    align-items: flex-end;
    gap: 0.5rem;
    height: 10rem;
    padding: 0.5rem 0 0;
    margin-bottom: 0.75rem;
    border-bottom: 1px solid var(--gp-trait-fort);
}

.gp-histogramme__mois {
    flex: 1 1 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    height: 100%;
}

.gp-histogramme__barres {
    flex: 1;
    display: flex;
    align-items: flex-end;
    gap: 3px;
    width: 100%;
    justify-content: center;
}

.gp-histogramme__barre {
    display: block;
    width: min(1.125rem, 40%);
    min-height: 2px;
    border-radius: 3px 3px 0 0;
}

.gp-histogramme__barre--passe { background: var(--gp-bleu-chantier); }
.gp-histogramme__barre--facture { background: #38bdf8; }

.gp-histogramme__libelle {
    margin-top: 0.25rem;
    font-size: 0.75rem;
    color: var(--gp-ardoise-600);
    font-variant-numeric: tabular-nums;
}

.gp-legende__carre {
    display: inline-block;
    width: 0.75rem;
    height: 0.75rem;
    border-radius: 2px;
    vertical-align: -0.05em;
}

.gp-legende__carre--passe { background: var(--gp-bleu-chantier); }
.gp-legende__carre--facture { background: #38bdf8; }