/*
 * ==========================================================
 * FitUI
 * The Design System for FitOcala
 *
 * File: 04-utilities.css
 * Version: 1.0.0
 * ==========================================================
 */

/*
|--------------------------------------------------------------------------
| Display
|--------------------------------------------------------------------------
*/

.fit-hidden {
    display: none !important;
}

.fit-block {
    display: block !important;
}

.fit-inline-block {
    display: inline-block !important;
}

.fit-flex {
    display: flex !important;
}

.fit-inline-flex {
    display: inline-flex !important;
}

.fit-grid {
    display: grid !important;
}

/*
|--------------------------------------------------------------------------
| Flex
|--------------------------------------------------------------------------
*/

.fit-flex-column {
    display: flex !important;
    flex-direction: column !important;
}

.fit-flex-center {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.fit-flex-between {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
}

.fit-flex-wrap {
    flex-wrap: wrap !important;
}

.fit-flex-nowrap {
    flex-wrap: nowrap !important;
}

.fit-flex-1 {
    flex: 1 1 0% !important;
}

.fit-flex-auto {
    flex: 1 1 auto !important;
}

.fit-flex-none {
    flex: none !important;
}

/*
|--------------------------------------------------------------------------
| Alignment
|--------------------------------------------------------------------------
*/

.fit-items-center {
    align-items: center !important;
}

.fit-items-start {
    align-items: flex-start !important;
}

.fit-items-end {
    align-items: flex-end !important;
}

.fit-justify-start {
    justify-content: flex-start !important;
}

.fit-justify-center {
    justify-content: center !important;
}

.fit-justify-between {
    justify-content: space-between !important;
}

.fit-justify-end {
    justify-content: flex-end !important;
}

/*
|--------------------------------------------------------------------------
| Text Alignment
|--------------------------------------------------------------------------
*/

.fit-text-center {
    text-align: center !important;
}

.fit-text-left {
    text-align: left !important;
}

.fit-text-right {
    text-align: right !important;
}

/*
|--------------------------------------------------------------------------
| Text Colors
|--------------------------------------------------------------------------
*/

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

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

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

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

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

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

/*
|--------------------------------------------------------------------------
| Font Weight
|--------------------------------------------------------------------------
*/

.fit-font-normal {
    font-weight: 400 !important;
}

.fit-font-medium {
    font-weight: 600 !important;
}

.fit-font-bold {
    font-weight: 800 !important;
}

.fit-font-heavy {
    font-weight: 950 !important;
}

/*
|--------------------------------------------------------------------------
| Width / Height
|--------------------------------------------------------------------------
*/

.fit-w-full {
    width: 100% !important;
}

.fit-h-full {
    height: 100% !important;
}

.fit-max-content {
    width: max-content !important;
}

.fit-min-w-0 {
    min-width: 0 !important;
}

.fit-max-w-none {
    max-width: none !important;
}

/*
|--------------------------------------------------------------------------
| Position
|--------------------------------------------------------------------------
*/

.fit-static {
    position: static !important;
}

.fit-relative {
    position: relative !important;
}

.fit-absolute {
    position: absolute !important;
}

.fit-fixed {
    position: fixed !important;
}

.fit-sticky {
    position: sticky !important;
}

/*
|--------------------------------------------------------------------------
| Border Radius
|--------------------------------------------------------------------------
*/

.fit-rounded-none {
    border-radius: 0 !important;
}

.fit-rounded-sm {
    border-radius: var(--fit-radius-sm) !important;
}

.fit-rounded-md {
    border-radius: var(--fit-radius-md) !important;
}

.fit-rounded {
    border-radius: var(--fit-radius) !important;
}

.fit-rounded-lg {
    border-radius: var(--fit-radius-lg) !important;
}

.fit-rounded-xl {
    border-radius: var(--fit-radius-xl) !important;
}

.fit-pill {
    border-radius: var(--fit-radius-round) !important;
}

/*
|--------------------------------------------------------------------------
| Shadows
|--------------------------------------------------------------------------
*/

.fit-shadow-none {
    box-shadow: none !important;
}

.fit-shadow {
    box-shadow: var(--fit-shadow) !important;
}

.fit-shadow-lg {
    box-shadow: var(--fit-shadow-lg) !important;
}

.fit-shadow-soft {
    box-shadow: var(--fit-shadow-soft) !important;
}

.fit-glow {
    box-shadow: var(--fit-glow) !important;
}

/*
|--------------------------------------------------------------------------
| Margin
|--------------------------------------------------------------------------
*/

.fit-m-0 {
    margin: 0 !important;
}

.fit-mx-auto {
    margin-inline: auto !important;
}

.fit-mt-auto {
    margin-top: auto !important;
}

.fit-mb-auto {
    margin-bottom: auto !important;
}

.fit-mt-1 {
    margin-top: var(--fit-space-1) !important;
}

.fit-mt-2 {
    margin-top: var(--fit-space-2) !important;
}

.fit-mt-3 {
    margin-top: var(--fit-space-3) !important;
}

.fit-mt-4 {
    margin-top: var(--fit-space-4) !important;
}

.fit-mt-5 {
    margin-top: var(--fit-space-5) !important;
}

.fit-mt-6 {
    margin-top: var(--fit-space-6) !important;
}

.fit-mb-1 {
    margin-bottom: var(--fit-space-1) !important;
}

.fit-mb-2 {
    margin-bottom: var(--fit-space-2) !important;
}

.fit-mb-3 {
    margin-bottom: var(--fit-space-3) !important;
}

.fit-mb-4 {
    margin-bottom: var(--fit-space-4) !important;
}

.fit-mb-5 {
    margin-bottom: var(--fit-space-5) !important;
}

.fit-mb-6 {
    margin-bottom: var(--fit-space-6) !important;
}

/*
|--------------------------------------------------------------------------
| Padding
|--------------------------------------------------------------------------
*/

.fit-p-0 {
    padding: 0 !important;
}

.fit-p-1 {
    padding: var(--fit-space-1) !important;
}

.fit-p-2 {
    padding: var(--fit-space-2) !important;
}

.fit-p-3 {
    padding: var(--fit-space-3) !important;
}

.fit-p-4 {
    padding: var(--fit-space-4) !important;
}

.fit-p-5 {
    padding: var(--fit-space-5) !important;
}

.fit-p-6 {
    padding: var(--fit-space-6) !important;
}

.fit-px-1 {
    padding-inline: var(--fit-space-1) !important;
}

.fit-px-2 {
    padding-inline: var(--fit-space-2) !important;
}

.fit-px-3 {
    padding-inline: var(--fit-space-3) !important;
}

.fit-px-4 {
    padding-inline: var(--fit-space-4) !important;
}

.fit-px-5 {
    padding-inline: var(--fit-space-5) !important;
}

.fit-py-1 {
    padding-block: var(--fit-space-1) !important;
}

.fit-py-2 {
    padding-block: var(--fit-space-2) !important;
}

.fit-py-3 {
    padding-block: var(--fit-space-3) !important;
}

.fit-py-4 {
    padding-block: var(--fit-space-4) !important;
}

.fit-py-5 {
    padding-block: var(--fit-space-5) !important;
}

/*
|--------------------------------------------------------------------------
| Gap
|--------------------------------------------------------------------------
*/

.fit-gap-0 {
    gap: 0 !important;
}

.fit-gap-1 {
    gap: var(--fit-space-1) !important;
}

.fit-gap-2 {
    gap: var(--fit-space-2) !important;
}

.fit-gap-3 {
    gap: var(--fit-space-3) !important;
}

.fit-gap-4 {
    gap: var(--fit-space-4) !important;
}

.fit-gap-5 {
    gap: var(--fit-space-5) !important;
}

.fit-gap-6 {
    gap: var(--fit-space-6) !important;
}

/*
|--------------------------------------------------------------------------
| Overflow
|--------------------------------------------------------------------------
*/

.fit-overflow-hidden {
    overflow: hidden !important;
}

.fit-overflow-auto {
    overflow: auto !important;
}

.fit-overflow-x-auto {
    overflow-x: auto !important;
}

.fit-overflow-y-auto {
    overflow-y: auto !important;
}

/*
|--------------------------------------------------------------------------
| Visibility
|--------------------------------------------------------------------------
*/

.fit-visible {
    visibility: visible !important;
}

.fit-invisible {
    visibility: hidden !important;
}

.fit-opacity-0 {
    opacity: 0 !important;
}

.fit-opacity-50 {
    opacity: .5 !important;
}

.fit-opacity-100 {
    opacity: 1 !important;
}

/*
|--------------------------------------------------------------------------
| Interaction
|--------------------------------------------------------------------------
*/

.fit-pointer {
    cursor: pointer !important;
}

.fit-no-pointer {
    pointer-events: none !important;
}

.fit-select-none {
    user-select: none !important;
}

/*
|--------------------------------------------------------------------------
| Responsive Helpers
|--------------------------------------------------------------------------
*/

@media (max-width: 700px) {
    .fit-mobile-hidden {
        display: none !important;
    }

    .fit-mobile-block {
        display: block !important;
    }

    .fit-mobile-full {
        width: 100% !important;
    }
}

@media (min-width: 701px) {
    .fit-desktop-hidden {
        display: none !important;
    }
}