/* #region RESPONSIVE CSS */

/* ***************************************************************************************************************************************************************/
/* ****   RESPONSIVE CSS   ***************************************************************************************************************************************/
/* ***************************************************************************************************************************************************************/

/* Extra Large Devices (Desktops, 1200px and up) */
@media (min-width: 1200px) {
    /* Styles for large desktops */
}

/* Large Devices (Laptops/Desktops, 992px and up) */
@media (min-width: 992px) and (max-width: 1199px) {
    /* Styles for medium to large screens */
}

/* Medium Devices (Tablets, 768px and up) */
@media (min-width: 768px) and (max-width: 991px) {
    /* Styles for tablets and small laptops */
}

/* Small Devices (Landscape Phones, 576px and up) */
@media (min-width: 576px) and (max-width: 768px) {
    /* Styles for larger mobile phones (landscape orientation) */

}

/* Extra Small Devices (Portrait Phones, Less than 576px) */
@media (max-width: 575px) {
    /* Styles for small mobile devices */
}

/* High-Resolution Screens (4K and up) */
@media (min-width: 2560px) {
    /* Styles for ultra-high resolution screens */
}

/* Portrait Mode for Tablets and Smartphones */
@media (orientation: portrait) and (max-width: 991px) {
    /* Adjustments specific to portrait orientation */
}

/* Landscape Mode for Tablets and Smartphones */
@media (orientation: landscape) and (max-width: 991px) {
    /* Adjustments specific to landscape orientation */
}

/* Retina Display (High DPI) */
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    /* Styles for retina and high-resolution displays */
}

/* Common device-specific breakpoints */

/* iPad Pro (12.9") Portrait & Landscape */
@media (min-width: 1024px) and (max-width: 1366px) {
    /* Styles for iPad Pro 12.9" */
}

/* iPad (7.9" & 9.7" versions) Portrait & Landscape */
@media (min-width: 768px) and (max-width: 1024px) {

    /* Styles for iPads 7.9" and 9.7" */
}

/* iPad (7.9" & 9.7" versions) Portrait & Landscape */
@media (max-width: 576px) {
    #user-btn {
        margin-top: 7px;
    }

        #user-btn::after {
            top: 16px !important;
        }

    #user-btn #username-span {
        margin-left: 5px;
    }

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

@media (min-width: 576px) and (max-width: 1024px) {
    
}

@media (min-width: 813px) and (max-width: 990px) {
    
}

/* iPhone X, XS, 11 Pro (375px wide) */
@media (min-width: 375px) and (max-width: 812px) {

}

/* iPhone 6, 7, 8, SE (2nd gen) (375px wide) */
@media (min-width: 375px) and (max-width: 667px) {
   
}

/* Galaxy S9, Pixel 3, and similar Android phones (360px wide) */
@media (min-width: 360px) and (max-width: 740px) {
    /* Styles for Galaxy S9, Pixel 3 */
}

@media (max-width: 992px) {

    html {
        font-size: 15px;
    }
}

@media (max-width: 768px) {

    .modal.bo-modal-mobile .modal-dialog {
        min-width: 96% !important;
    }

    .modal form .modal-body .sel2-dropDownParent .select2.select2-container .select2-selection,
    div#table-filters .select2.select2-container .select2-selection,
    div.card-body .select2.select2-container .select2-selection {
        height: auto !important;
    }

    div.card-body .select2-container .select2-selection--multiple .select2-selection__rendered {
        display: block !important;
        margin: 0 !important;
    }

    .modal.fade .modal-body {
        padding-right: 1rem !important;
        padding-left: 1rem !important;
    }

    nav#main-nav {
        height: auto !important;
    }

        nav#main-nav .navbar-toggler {
            margin: 0 !important;
        }

    nav#main-nav #main-logo {
        height: auto !important;
        margin-top: 5px !important;
        margin-left: 0 !important;
    }

        nav#main-nav ul.navbar-nav {
            margin-left: 0 !important;
        }

    #table-filters {
        margin-top: 15px;
    }

        #table-filters div {
            width: 100% !important;
            margin-bottom: 7px;
            margin-right: 0 !important;
        }
}


/* ***************************************************************************************************************************************************************/
/* ****   / RESPONSIVE CSS   ***************************************************************************************************************************************/
/* ***************************************************************************************************************************************************************/

/* #endregion */