/* ==========================================================================
   Utilitaires texte / fond / bordure (Bootstrap les déclare en !important)
   ========================================================================== */

.text-muted {
    color: var(--text-muted) !important;
}

.text-secondary {
    color: var(--text-tertiary) !important;
}

.text-dark {
    color: var(--text) !important;
}

.text-success {
    color: var(--color-success) !important;
}

.text-danger {
    color: var(--color-danger) !important;
}

.text-warning {
    color: var(--color-warning) !important;
}

.bg-light {
    background-color: var(--bg-subtle) !important;
}

.bg-white {
    background-color: var(--surface) !important;
}

.border,
.border-top,
.border-bottom {
    border-color: var(--border) !important;
}

/* --------------------------------------------------------------------------
   Header rows (title + action button(s)) built with Bootstrap's .d-flex
   .justify-content-between across most module pages — on a narrow phone
   viewport, a long title next to one or more buttons has nowhere to shrink
   to and pushes the row past the viewport width. Wrapping only ever kicks in
   once the row no longer fits, so this has no effect at desktop widths where
   it already fits on one line.
   -------------------------------------------------------------------------- */

.d-flex.justify-content-between {
    flex-wrap: wrap;
    row-gap: 0.5rem;
}