/* ============================================================================
   Card headings — the <card-heading> tag helper.

   The helper renders a plain .card-header, so padding, background, border and
   radius come from the theme's card styling. Everything below is only the
   heading text itself: title in near-black, optional subtitle under it in muted
   green-grey, no icon disc — the words say what the card is.
   ============================================================================ */

.card-heading-text {
    min-width: 0;
}

.card-heading-title {
    margin: 0;
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: -0.01em;
    color: #101615;
}

.card-heading-subtitle {
    margin: 3px 0 0;
    font-size: 0.8125rem;
    font-weight: 500;
    line-height: 1.5;
    color: #7B8480;
}

/* Nothing to say and nothing loaded into it yet: takes no space rather than
   pushing the card body down by an empty line. */
.card-heading-subtitle:empty {
    display: none;
}

/* The card's own controls — a badge, a filter, a refresh button. */
.card-heading-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}

/* A heading that sits inside a card body, or directly on the page, rather than
   at the top of a card: it needs the text styling but none of the header's
   chrome, which would otherwise draw a band across the middle of a card. */
.card-heading-flush {
    padding: 0;
    background: none;
    border: 0;
}

@media (max-width: 575.98px) {
    .card-heading-actions {
        margin-left: 0;
    }
}