/* ===================================================================
   UTILITIES/RESPONSIVE.CSS
   Responsive Utility Classes
   =================================================================== */
/* ===== 91. RESPONSIVE UTILITIES (XL BREAKPOINT) ===== */

/* Media query for extra large screens (min-width: 1200px) */
@media (min-width: 1200px) {
    /* ----- 91.1 Text Alignment ----- */
    .text-xl-center {
        text-align: center !important;
    }

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

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

    /* ----- 91.2 Display Properties ----- */
    .d-xl-none {
        display: none !important;
    }
    
    .d-xl-block {
        display: block !important;
    }
    
    .d-xl-inline {
        display: inline !important;
    }
    
    .d-xl-inline-block {
        display: inline-block !important;
    }
    
    .d-xl-flex {
        display: flex !important;
    }
    
    .d-xl-inline-flex {
        display: inline-flex !important;
    }

    /* ----- 91.3 Grid Display ----- */
    .d-xl-grid {
        display: grid !important;
    }

    /* ===== 92. RESPONSIVE FLEXBOX ===== */

    /* ----- 92.1 Flex Direction ----- */
    .flex-xl-row {
        flex-direction: row !important;
    }

    .flex-xl-column {
        flex-direction: column !important;
    }

    .flex-xl-row-reverse {
        flex-direction: row-reverse !important;
    }

    .flex-xl-column-reverse {
        flex-direction: column-reverse !important;
    }

    /* ----- 92.2 Justify Content ----- */
    .justify-content-xl-start {
        justify-content: flex-start !important;
    }

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

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

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

    .justify-content-xl-around {
        justify-content: space-around !important;
    }

    .justify-content-xl-evenly {
        justify-content: space-evenly !important;
    }

    /* ----- 92.3 Align Items ----- */
    .align-items-xl-start {
        align-items: flex-start !important;
    }

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

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

    .align-items-xl-baseline {
        align-items: baseline !important;
    }

    .align-items-xl-stretch {
        align-items: stretch !important;
    }

    /* ----- 92.4 Align Content ----- */
    .align-content-xl-start {
        align-content: flex-start !important;
    }

    .align-content-xl-end {
        align-content: flex-end !important;
    }

    .align-content-xl-center {
        align-content: center !important;
    }

    .align-content-xl-between {
        align-content: space-between !important;
    }

    .align-content-xl-around {
        align-content: space-around !important;
    }

    .align-content-xl-stretch {
        align-content: stretch !important;
    }

    /* ----- 92.5 Align Self ----- */
    .align-self-xl-auto {
        align-self: auto !important;
    }

    .align-self-xl-start {
        align-self: flex-start !important;
    }
    
    .align-self-xl-end {
        align-self: flex-end !important;
    }
    
    .align-self-xl-center {
        align-self: center !important;
    }
    
    .align-self-xl-baseline {
        align-self: baseline !important;
    }
    
    .align-self-xl-stretch {
        align-self: stretch !important;
    }

    /* ----- 92.6 Flex Wrap ----- */
    .flex-xl-wrap {
        flex-wrap: wrap !important;
    }
    
    .flex-xl-nowrap {
        flex-wrap: nowrap !important;
    }
    
    .flex-xl-wrap-reverse {
        flex-wrap: wrap-reverse !important;
    }
}

/* ===== 93. RESPONSIVE FLEXBOX UTILITY CLASSES ===== */

/* ----- 93.1 Flex Grow ----- */
.flex-grow-0 {
    flex-grow: 0 !important;
}

.flex-grow-1 {
    flex-grow: 1 !important;
}

/* ----- 93.2 Flex Shrink ----- */
.flex-shrink-0 {
    flex-shrink: 0 !important;
}

.flex-shrink-1 {
    flex-shrink: 1 !important;
}

/* ----- 93.3 Flex Fill ----- */
.flex-fill {
    flex: 1 1 auto !important;
}