/*
 * Token-backed utilities
 *
 * Prefer semantic component and shared-pattern classes. These utilities are
 * reserved for one-off layout composition where a dedicated class would add
 * no meaning. Unlike MudBlazor's fixed utility values, every value is owned by
 * the Jexion token scale.
 */
.jexion-u-d-block { display: block !important; }
.jexion-u-d-flex { display: flex !important; }
.jexion-u-flex-row { flex-direction: row !important; }
.jexion-u-flex-column { flex-direction: column !important; }
.jexion-u-flex-wrap { flex-wrap: wrap !important; }
.jexion-u-flex-grow-1 { flex-grow: 1 !important; }
.jexion-u-align-center { align-items: center !important; }
.jexion-u-align-self-start { align-self: flex-start !important; }
.jexion-u-justify-center { justify-content: center !important; }
.jexion-u-justify-end { justify-content: flex-end !important; }
.jexion-u-h-100 { height: 100% !important; }
.jexion-u-w-100 { width: 100% !important; }
.jexion-u-overflow-auto { overflow: auto !important; }
.jexion-u-overflow-hidden { overflow: hidden !important; }
.jexion-u-text-end { text-align: end !important; }
.jexion-u-text-center { text-align: center !important; }

.jexion-u-gap-1 { gap: var(--jexion-space-1) !important; }
.jexion-u-gap-2 { gap: var(--jexion-space-2) !important; }
.jexion-u-gap-4 { gap: var(--jexion-space-4) !important; }

.jexion-u-pa-2 { padding: var(--jexion-space-2) !important; }
.jexion-u-pa-3 { padding: var(--jexion-space-3) !important; }
.jexion-u-pa-4 { padding: var(--jexion-space-4) !important; }
.jexion-u-pa-6 { padding: var(--jexion-space-6) !important; }
.jexion-u-pa-10 { padding: var(--jexion-space-10) !important; }
.jexion-u-pt-2 { padding-top: var(--jexion-space-2) !important; }
.jexion-u-pt-3 { padding-top: var(--jexion-space-3) !important; }
.jexion-u-pt-4 { padding-top: var(--jexion-space-4) !important; }
.jexion-u-pt-16 { padding-top: var(--jexion-space-16) !important; }
.jexion-u-pb-2 { padding-bottom: var(--jexion-space-2) !important; }
.jexion-u-pb-8 { padding-bottom: var(--jexion-space-8) !important; }
.jexion-u-px-4 {
    padding-inline: var(--jexion-space-4) !important;
}
.jexion-u-px-6 {
    padding-inline: var(--jexion-space-6) !important;
}
.jexion-u-py-0 {
    padding-block: var(--jexion-space-0) !important;
}
.jexion-u-py-6 {
    padding-block: var(--jexion-space-6) !important;
}
.jexion-u-py-8 {
    padding-block: var(--jexion-space-8) !important;
}

.jexion-u-mt-0 { margin-top: var(--jexion-space-0) !important; }
.jexion-u-mt-1 { margin-top: var(--jexion-space-1) !important; }
.jexion-u-mt-2 { margin-top: var(--jexion-space-2) !important; }
.jexion-u-mt-3 { margin-top: var(--jexion-space-3) !important; }
.jexion-u-mt-4 { margin-top: var(--jexion-space-4) !important; }
.jexion-u-mt-6 { margin-top: var(--jexion-space-6) !important; }
.jexion-u-mt-8 { margin-top: var(--jexion-space-8) !important; }
.jexion-u-mt-10 { margin-top: var(--jexion-space-10) !important; }
.jexion-u-mt-n4 { margin-top: calc(-1 * var(--jexion-space-4)) !important; }
.jexion-u-mt-auto { margin-top: auto !important; }
.jexion-u-mb-0 { margin-bottom: var(--jexion-space-0) !important; }
.jexion-u-mb-1 { margin-bottom: var(--jexion-space-1) !important; }
.jexion-u-mb-2 { margin-bottom: var(--jexion-space-2) !important; }
.jexion-u-mb-3 { margin-bottom: var(--jexion-space-3) !important; }
.jexion-u-mb-4 { margin-bottom: var(--jexion-space-4) !important; }
.jexion-u-mb-8 { margin-bottom: var(--jexion-space-8) !important; }
.jexion-u-my-1 {
    margin-block: var(--jexion-space-1) !important;
}
.jexion-u-my-4 {
    margin-block: var(--jexion-space-4) !important;
}
.jexion-u-ms-2 { margin-inline-start: var(--jexion-space-2) !important; }
.jexion-u-ms-3 { margin-inline-start: var(--jexion-space-3) !important; }
.jexion-u-me-2 { margin-inline-end: var(--jexion-space-2) !important; }
.jexion-u-ms-n1 { margin-inline-start: calc(-1 * var(--jexion-space-1)) !important; }
.jexion-u-ml-3 { margin-left: var(--jexion-space-3) !important; }
.jexion-u-ml-2 { margin-left: var(--jexion-space-2) !important; }
.jexion-u-ml-4 { margin-left: var(--jexion-space-4) !important; }
.jexion-u-mr-1 { margin-right: var(--jexion-space-1) !important; }
.jexion-u-mr-2 { margin-right: var(--jexion-space-2) !important; }
.jexion-u-mr-3 { margin-right: var(--jexion-space-3) !important; }
.jexion-u-mx-2 {
    margin-inline: var(--jexion-space-2) !important;
}

@media (min-width: 960px) {
    .jexion-u-pa-md-8 {
        padding: var(--jexion-space-8) !important;
    }
}
