@media (max-width: 1180px) {
    :root {
      --sidebar-width: 220px;
    }
  
    .stats-grid {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
  
    .page-grid.two-columns {
      grid-template-columns: 1fr;
    }
  
    .page-grid.three-columns {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
  }
  
  @media (max-width: 860px) {
    .app-shell {
      grid-template-columns: 1fr;
    }
  
    .sidebar {
      position: static;
      height: auto;
    }
  
    .sidebar-brand {
      min-height: 70px;
    }
  
    .sidebar-nav {
      display: flex;
      overflow-x: auto;
      padding: 10px;
    }
  
    .nav-group {
      display: contents;
    }
  
    .nav-group + .nav-group {
      margin-top: 0;
    }
  
    .nav-group-title {
      display: none;
    }
  
    .nav-item {
      width: auto;
      flex: 0 0 auto;
    }
  
    .sidebar-user {
      display: none;
    }
  
    .topbar {
      position: static;
      min-height: auto;
      padding: 16px 18px;
    }
  
    .page-content {
      padding: 18px;
    }
  
    .form-grid,
    .form-grid.three-columns {
      grid-template-columns: 1fr;
    }
  
    .page-grid.three-columns {
      grid-template-columns: 1fr;
    }
  }
  
  @media (max-width: 600px) {
    .login-screen {
      padding: 16px;
    }
  
    .login-card {
      padding: 24px;
    }
  
    .topbar {
      align-items: flex-start;
      flex-direction: column;
    }
  
    .topbar-actions {
      width: 100%;
    }
  
    .topbar-actions .button {
      width: 100%;
    }
  
    .stats-grid {
      grid-template-columns: 1fr;
    }
  
    .toolbar,
    .toolbar-left,
    .toolbar-right {
      align-items: stretch;
      flex-direction: column;
    }
  
    .toolbar .button,
    .toolbar input,
    .toolbar select,
    .search-box {
      width: 100%;
    }
  
    .drawer {
      width: 100vw;
    }
  }

  @media (max-width: 1080px) {
    .call-layout {
      grid-template-columns: 1fr;
    }
  
    .call-side-column {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }
  }
  
  @media (max-width: 760px) {
    .call-header-card {
      align-items: stretch;
      flex-direction: column;
    }
  
    .call-header-actions {
      flex-direction: column;
    }
  
    .call-header-actions .button {
      width: 100%;
    }
  
    .call-side-column {
      grid-template-columns: 1fr;
    }
  
    .goal-roadmap-item {
      min-width: 150px;
    }
  
    .manager-text {
      padding: 16px;
      font-size: 16px;
    }
  }
  
  @media (max-width: 620px) {
    .details-grid {
      grid-template-columns: 1fr;
    }
  }