/*
 * AIIA Coalition brand layer, loaded after theme.min.css and style.css.
 *
 * Shares the Hub ecosystem's typography (Lexend headings, Roboto body,
 * as on hubculture.com) while AIIA keeps its own palette. Blue belongs
 * to Hub Culture itself; Ven amounts are green on every Hub site.
 */
:root {
    --aiia-font-heading: 'Lexend', 'Roboto', system-ui, -apple-system, sans-serif;
    --aiia-font-body: 'Roboto', system-ui, -apple-system, sans-serif;

    /* Sampled from the Coalition "scales" mark */
    --aiia-ring-deep: #226585;
    --aiia-ring-teal: #71C0BD;
    --aiia-scale-violet: #9C8BC5;

    /* Ven green, as on ven.vc; the darker shade is for text on white */
    --ven-green: #42B479;
    --ven-green-text: #237A4C;
    --ven-green-soft: rgba(66, 180, 121, .12);
}

/* Typography */
body,
.tooltip,
.popover,
.ql-container {
    font-family: var(--aiia-font-body);
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6,
.display-1, .display-2, .display-3, .display-4,
.navbar-nav .nav-link,
.navbar-btn,
.btn,
.custom-btn,
.modal-title {
    font-family: var(--aiia-font-heading);
}

/* Lexend is wider and heavier than the theme's HK Grotesk, so step the
   weights down a notch and tighten display sizes to keep the same feel. */
.display-1, .display-2, .display-3, .display-4 {
    letter-spacing: -0.015em;
}

h1.font-weight-bold, h2.font-weight-bold, h3.font-weight-bold,
h4.font-weight-bold, h5.font-weight-bold, h6.font-weight-bold,
.display-1.font-weight-bold, .display-2.font-weight-bold,
.display-3.font-weight-bold, .display-4.font-weight-bold {
    font-weight: 500 !important;
}

.btn,
.navbar-btn {
    font-weight: 500;
}

/* Logo: the 2x mark fills its canvas edge to edge, unlike the old padded
   70px image, so show it a little smaller. Leave room for the fixed Hub
   globe (#hub-globe, 10px + 24px) so the two never overlap. */
.navbar-brand:not(.globe) {
    margin-left: 30px;
}

.navbar-brand:not(.globe) img {
    width: 56px;
    height: auto;
}

/* Ven and payment amounts */
.ven-amount {
    color: var(--ven-green-text);
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

.ven-amount.is-pending {
    color: #6B7280;
    font-weight: 400;
}

.ven-chip {
    display: inline-block;
    padding: .1em .55em;
    border-radius: 999px;
    background: var(--ven-green-soft);
    color: var(--ven-green-text);
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

.money {
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}
