/* Onglets et onglet « Campagnes ». */

.tabs {
    display: flex;
    justify-content: center;
    gap: 8px;
    margin: 18px auto 0;
}

.tab {
    padding: 8px 18px;
    color: var(--green-soft);
    font: inherit;
    font-family: var(--font-mono);
    font-size: 14px;
    letter-spacing: 1px;
    background: transparent;
    border: 1px solid var(--border);
    border-radius: var(--radius-s);
    cursor: pointer;
}

.tab[aria-selected="true"] {
    color: var(--green);
    background: var(--tint-strong);
    box-shadow: 0 0 10px var(--glow);
}

.tab:focus-visible {
    outline: 2px solid var(--green);
    outline-offset: 2px;
}

/* Sans script, les onglets ne font rien : on ne les montre qu'une fois la page
   initialisee (`js-ready`, pose en dernier par main.js). */
html:not(.js-ready) .tabs {
    visibility: hidden;
}

.campaigns-status {
    margin: 22px auto 0;
    max-width: 62ch;
    color: var(--text-dim);
    text-align: center;
}

.campaigns-status[hidden] {
    display: none;
}

.campaigns-list {
    display: grid;
    gap: 16px;
    max-width: 72ch;
    margin: 22px auto 0;
}

.campaign-card {
    padding: 18px 20px;
    text-align: left;
    border: 1px solid var(--border);
    border-left-width: 4px;
    border-radius: var(--radius-m);
    background: var(--tint);
}

.campaign-card--high {
    border-left-color: var(--green);
}

.campaign-card--moderate {
    border-left-color: var(--warn);
}

.campaign-card h3 {
    font-family: var(--font-mono);
    font-size: 15px;
    font-weight: normal;
    color: var(--green);
    overflow-wrap: anywhere;
}

.campaign-meta {
    margin-top: 6px;
    font-size: 14px;
    color: var(--text-dim);
}

/* La justification est un texte a lignes (liste « - … ») : on garde ses retours
   a la ligne sans HTML. */
.campaign-justification {
    margin-top: 12px;
    white-space: pre-line;
    overflow-wrap: anywhere;
    color: var(--green-soft);
    font-size: 15px;
    line-height: 1.6;
}

.campaign-note {
    margin-top: 8px;
    font-size: 13px;
    color: var(--text-dim);
}
