﻿/* Mobile + small tablet portrait */
@media (max-width: 768px) {
    /*.filterActionSheet, */
    .floatingBtn {
        display: block;
    }

    .breadcrumbs {
        display: none !important;
    }
    .tbl-header {
        flex-direction: column;
        gap: 10px;
    }
    .sidebar {
        width: 14rem;
        position: fixed;
        z-index: 9;
        margin-left: -14rem;
    }
        .sidebar.toggled {
            margin-left:0
        }
            #wrapper #content-wrapper {
        margin-left: 0rem;
    }
    #accordionSidebar.toggled .brand-logo-icon {
        display: none
    }
    body.sidebar-collapsed .bg-overlay {
        content: '';
        position: fixed;
        width: 100%;
        height: 100%;
        left: 0;
        top: 0;
        background: #00000047
    }
    body.sidebar-collapsed .sidebar {
/*        width: 14rem !important;
        position: fixed;
        z-index: 9;
        margin-left: 0;*/
    }

  
        .sidebar .nav-item .nav-link {
            width: 12rem;
            padding: 0.5rem 0.75rem;
        }

    .navbar-expand {
        margin-bottom: 0rem;
    }
    .contentWrapper {
/*        // padding: 0px 0px; */
    }

    .sidebar .nav-item .nav-link .d-flex {
        gap: 5px
    }

   
    .sticky.page-header {
        padding: 6px 12px 6px 12px;
    }
}

/* Tablet + Mobile styles */
@media (max-width: 991px) {
    
}
@media (max-width: 1024px) {
    .filter-label, .filter-select-telerik, .filter-select, .clear-filter, .grid-title {
        display: none
    }

    .filter-bar {
        border: 1px solid var(--theme-primary);
        border-radius: 6px;
    }
/*    .k-toolbar.k-grid-toolbar .k-toolbar-prev, .k-toolbar.k-grid-toolbar .k-separator, .k-toolbar.k-grid-toolbar .k-toolbar-next{
        display: none
    }*/
}

/* Mobile only */
@media (max-width: 768px) {
    .grid-title, .exam-form-tabs .k-tabstrip-items-wrapper {
        display: none
    }
    .page-header{
        flex-direction: column;
        gap: 10px
    }
    .statistic.card-clickable .icon {
        display: none
    }
    .dashboardstatistic .col-4 {
        padding: 4px;
    }
    .dashboardstatistic .statistic {
        margin-bottom: 5px
    }
    .m-flex-h, .page-header.m-flex-h {
        flex-direction: row;
    }
    .header-actions {
        flex-direction: row-reverse !important
    }
    .w-50 {
        width: 100% !important
    }
    .commentBox .card-body, .test-fields-container, .m-flex-column {
        flex-direction: column
    }
    .aidUsageWrapper {
        flex-direction: column;
        width: fit-content;
    }
/*    .page-header {
        flex-direction: column !important;
        gap: 10px;
    }*/
    .driver-info-wrapper [class*="col-"] {
        padding-inline: 0.75rem !important
    }
    .submit-container .row{
        flex-direction: column;
    }
    .summary-container .content-wrapper {
        grid-template-columns: repeat(1, 1fr);
    }
    .addClinicWrapper [class*="col-"]{
        padding-inline: 0
    }
    .submit-container [class*="col-"], .addClinicWrapper [class*="col-"] {
        width: 100%;
        max-width: 100%;
    }
        .documents-container .page-card .form-group {
        flex-direction: column
    }
        .documents-container .page-card .form-group .col-3, .documents-container .page-card .form-group .col-9 {
            width: 100%;
            max-width: 100%;
        }
/*    .exam-form-tabs .k-tabstrip-items-wrapper{
        display: none
    }*/
}

/* Styles for screens smaller than 1920px width */
@media (max-width: 1919px) {
    /* .k-tabstrip-items {
        flex-wrap: nowrap;
        position: relative;
        z-index: 0;
        overflow-x: auto;
        overflow-y: hidden;
        padding: 0px 5px 0px 45px;
    }
    .mobile-nav-prev {
        position: absolute;
        top: 0;
        left: 0;
        z-index: 99;
    }
    .mobile-nav-next {
        position: sticky;
        top: 0;
        right: 0;
        z-index: 99;
    }*/
}

/* Tablet only */
@media (min-width: 768px) and (max-width: 991px) {
}

@media (min-width: 992px) {
    .desktop-only-block {
        display: block !important;
    }
    .sidebar.toggled {
        padding: 16px 10px;
        box-shadow: 0px 0px 15px 1px #00000047;
    }

        .sidebar.toggled .sidebar-brand .brand-logo-icon {
            display: none !important
        }
        .sidebar.toggled .sidebar-brand .brand-logo {
            display: flex !important
        }
    .desktop-only-inline {
        display: inline !important;
    }

    .desktop-only-flex {
        display: flex !important;
    }

}

