/*
|--------------------------------------------------------------------------
| Reusable Utility Classes
|--------------------------------------------------------------------------
|
| Generic utilities not provided by Bootstrap.
| This file should remain project-independent wherever possible.
|
*/


/*
|--------------------------------------------------------------------------
| Spacing
|--------------------------------------------------------------------------
|
| Bootstrap currently provides spacing utilities up to level 5.
| These extend the scale where larger spacing is needed.
|
*/

.mt-6 { margin-top: 4rem !important; }
.mt-7 { margin-top: 5rem !important; }
.mt-8 { margin-top: 6rem !important; }

.mb-6 { margin-bottom: 4rem !important; }
.mb-7 { margin-bottom: 5rem !important; }
.mb-8 { margin-bottom: 6rem !important; }

.my-6 {
   margin-top: 4rem !important;
   margin-bottom: 4rem !important;
}

.my-7 {
   margin-top: 5rem !important;
   margin-bottom: 5rem !important;
}

.my-8 {
   margin-top: 6rem !important;
   margin-bottom: 6rem !important;
}


.pt-6 { padding-top: 4rem !important; }
.pt-7 { padding-top: 5rem !important; }
.pt-8 { padding-top: 6rem !important; }

.pb-6 { padding-bottom: 4rem !important; }
.pb-7 { padding-bottom: 5rem !important; }
.pb-8 { padding-bottom: 6rem !important; }

.py-6 {
   padding-top: 4rem !important;
   padding-bottom: 4rem !important;
}

.py-7 {
   padding-top: 5rem !important;
   padding-bottom: 5rem !important;
}

.py-8 {
   padding-top: 6rem !important;
   padding-bottom: 6rem !important;
}


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

.w-fit { width: fit-content !important; }
.min-w-0 { min-width: 0 !important; }
.max-w-100 { max-width: 100% !important; }


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

.h-fit { height: fit-content !important; }
.min-h-100 { min-height: 100% !important; }
.min-vh-100 { min-height: 100vh !important; }


/*
|--------------------------------------------------------------------------
| Object Fit
|--------------------------------------------------------------------------
*/

.object-fit-cover { object-fit: cover !important; }
.object-fit-contain { object-fit: contain !important; }
.object-position-center { object-position: center !important; }


/*
|--------------------------------------------------------------------------
| Cursor
|--------------------------------------------------------------------------
*/

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


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

.overflow-x-hidden { overflow-x: hidden !important; }
.overflow-y-auto { overflow-y: auto !important; }


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

.text-nowrap { white-space: nowrap !important; }
.text-balance { text-wrap: balance; }


/*
|--------------------------------------------------------------------------
| Line Clamp
|--------------------------------------------------------------------------
*/

.line-clamp-1, .line-clamp-2, .line-clamp-3 {
   display: -webkit-box;
   overflow: hidden;
   -webkit-box-orient: vertical;
}

.line-clamp-1 { -webkit-line-clamp: 1; line-clamp: 1; }
.line-clamp-2 { -webkit-line-clamp: 2; line-clamp: 2; }
.line-clamp-3 { -webkit-line-clamp: 3; line-clamp: 3; }


/*
|--------------------------------------------------------------------------
| Aspect Ratio
|--------------------------------------------------------------------------
*/

.aspect-square { aspect-ratio: 1 / 1; }
.aspect-video { aspect-ratio: 16 / 9; }


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

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