@media (0 <= width < 768px) {
  .sidebar {
    width: 4rem;
    padding: 0.75rem;
    transform: translate(100%);
  }
  .sidebar .logo {
    gap: 0;
  }
  .sidebar .logo .icon {
    width: 2.5rem;
    height: 2.5rem;
    font-weight: 600;
  }
  .sidebar .logo .icon i {
    font-size: var(--text-base);
    font-weight: var(--font-weight-semibold);
  }
  .sidebar .logo .title {
    display: none;
  }
  .sidebar nav ul li a {
    padding: 0.75rem 0.5rem;
  }
  .sidebar nav ul li a span {
    display: none;
  }
  .sidebar .quick-actions {
    display: flex;
    justify-content: center;
  }
  .sidebar .quick-actions h3 {
    display: none;
  }
  .sidebar .quick-actions .buttons button {
    width: 40px;
    height: 40px;
    margin-block-end: 1.5rem;
    padding: 0.5rem 0;
    justify-content: flex-start;
  }
  .sidebar .quick-actions .buttons button:last-child {
    margin-block-end: 0.25rem;
  }
  .sidebar .quick-actions .buttons button .icon {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 0.5rem;
  }
  .sidebar .quick-actions .buttons button span {
    display: none;
  }
}
@media (768px <= width < 1024px) {
  .sidebar {
    width: 4rem;
    padding: 0.75rem;
  }
  .sidebar .logo {
    gap: 0;
  }
  .sidebar .logo .icon {
    width: 2.5rem;
    height: 2.5rem;
    font-weight: 600;
  }
  .sidebar .logo .icon i {
    font-size: var(--text-base);
    font-weight: var(--font-weight-semibold);
  }
  .sidebar .logo .title {
    display: none;
  }
  .sidebar nav ul li a {
    padding: 0.75rem 0.5rem;
  }
  .sidebar nav ul li a span {
    display: none;
  }
  .sidebar .quick-actions {
    display: flex;
    justify-content: center;
  }
  .sidebar .quick-actions h3 {
    display: none;
  }
  .sidebar .quick-actions .buttons button {
    width: 40px;
    height: 40px;
    margin-block-end: 1.5rem;
    padding: 0.5rem 0;
    justify-content: flex-start;
  }
  .sidebar .quick-actions .buttons button:last-child {
    margin-block-end: 0.25rem;
  }
  .sidebar .quick-actions .buttons button .icon {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 0.5rem;
  }
  .sidebar .quick-actions .buttons button span {
    display: none;
  }
}
@media (1024px <= width < 1280px) {
  .sidebar {
    width: 4rem;
    padding: 0.75rem;
  }
  .sidebar .logo {
    gap: 0;
  }
  .sidebar .logo .icon {
    width: 2.5rem;
    height: 2.5rem;
    font-weight: 600;
  }
  .sidebar .logo .icon i {
    font-size: var(--text-base);
    font-weight: var(--font-weight-semibold);
  }
  .sidebar .logo .title {
    display: none;
  }
  .sidebar nav ul li a {
    padding: 0.75rem 0.5rem;
  }
  .sidebar nav ul li a span {
    display: none;
  }
  .sidebar .quick-actions {
    display: flex;
    justify-content: center;
  }
  .sidebar .quick-actions h3 {
    display: none;
  }
  .sidebar .quick-actions .buttons button {
    width: 40px;
    height: 40px;
    margin-block-end: 1.5rem;
    padding: 0.5rem 0;
    justify-content: flex-start;
  }
  .sidebar .quick-actions .buttons button:last-child {
    margin-block-end: 0.25rem;
  }
  .sidebar .quick-actions .buttons button .icon {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 0.5rem;
  }
  .sidebar .quick-actions .buttons button span {
    display: none;
  }
}