/* ≤ 1280px — large laptop */
@media (max-width: 1280px) {
    
}

/* ≤ 1024px — small laptop / landscape tablet */
@media (max-width: 1024px) {
    .content {
        padding: 0 0 0 var(--s-16);
    }
    .pr-60 {
        padding-right: var(--s-16) !important;
    }
}

/* ≤ 768px — tablet portrait */
@media (max-width: 768px) {
    .content {
        padding: 0 0 0 var(--s-14);
    }
    .summary-top-cards {
        flex-wrap: wrap;
    }
        .summary-top-cards>div{
            min-width:100%;
        }
        .projects-cards,
        .status-kpis,
        .pr-60 {
            padding-right: var(--s-14) !important;
        }
    .page-breadcrumb,
    .toolbar-container.wi.with-breadcrumbs {
        margin-bottom: var(--s-14);
        margin-top: var(--s-14);
    }
        .page-breadcrumb,
        .page-breadcrumb.with-toolbar {
            padding: 0 0 0 var(--s-14);
        }
    .project-filter-row,
    .project-display-types {
        padding: 0 var(--s-14) 0 var(--s-14);
    }
    .project-filter-row{
        height:auto!important;
    }
        .project-filter-row > .search-box{
            min-width:100%;
        }
    .filter-row-dropdown-select {
        width:auto;
    }
    .stages-filter {
        padding-bottom: var(--s-14);
        margin-bottom: var(--s-14);
        margin-right: var(--s-14);
    }
    .projects-cards {
        grid-template-columns:1fr;
    }
    .psd-tab-nav {
        list-style: none;
        margin: 0;
        display: flex;
        gap: calc(4 * var(--vw));
        flex-wrap: nowrap;
        padding: 0 !important;
        overflow-x: auto;
    }
    .selected-project-specific-info{
        padding:var(--s-10);
    }
    .col-lg-55{
        width:100%;
    }
    div#details-tab-main-project > div,
    div#details-tab-main-project {
        flex-wrap: wrap;
    }
    div#details-tab-main-project > div > div {
        min-width: 100%;
    }
    .main-wrapper.full-menu.slide .menu-title,
    .main-wrapper.full-menu.slide .userprofile{
        display:none;
    }
    .main-wrapper.full-menu.slide .menu-mobile {
        margin-left: calc(220 * var(--vw))
    }
    #main-view.slide .page-wrapper{
        width:100%!important;
    }

    .filter-row {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        height: auto;
        margin-bottom: var(--s-20);
        padding-left: var(--s-14);
    }
    .filter-search{
        max-width:100%;
    }
    .filter-container {
        height: auto;
        display: flex;
        flex-wrap: wrap;
        gap: var(--s-10);
    }
    .filter-container button{
        margin:0;
    }
    .userprofile > a > span{
        display:none;
    }
    .dropdown-menu.notifications {
        right: calc(-1 * var(--s-20))!important;
        width: 100% !important;
    }
    .top-header .notifications{
        margin-right:var(--s-10);
    }
}

/* ≤ 576px — mobile */
@media (max-width: 576px) {
    .content {
        padding: 0 0 0 var(--s-14);
    }
    .pr-60 {
        padding-right: var(--s-14) !important;
    }
}

/* ≤ 430px —  mobile (iPhone 14 etc.) */
@media (max-width: 430px) {
    .content {
        padding: 0 0 0 var(--s-14);
    }

    .pr-60 {
        padding-right: var(--s-14) !important;
    }

    .psd-tab-nav-wrap {
        width: 100%;
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch !important;
        scrollbar-width: thin;
    }

    .psd-tab-nav {
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        list-style: none;
        margin: 0;
        padding: 0 !important;
        gap: 4px;
        width: max-content;
    }

    .psd-tab {
        display: flex;
        align-items: center;
        justify-content: center;
        background-color: transparent;
        border: none;
        white-space: nowrap;
        flex-shrink: 0;
    }
    .flex-1.card.summary-action-card {
        border-radius: var(--new-card-border-radius) !important;
        border: 1px solid var(--border-default-color) !important;
        min-width: auto !important;
    }
    .detail-list-title {
        float: none !important;
    }

    .detail-list-content {
        float: none !important;
        width: auto;
    }
    .new-table-style {
        .col-completion, .col-vendor, .col-pm, .col-lastupdate {
            /* display: none; */
        }
    }
/* ≤ 375px — small mobile (iPhone SE etc.) */
@media (max-width: 375px) {
    .content { 
        padding: 0 0 0 var(--s-14);
    }
    .pr-60 {
        padding-right: var(--s-14) !important;
    }
}