@media (max-width: 768px) {
  .sidebar {
    width: 100%;
    left: -100%;
    height: 100%;
    background-color: var(--sidebar-bg, white);
    transition: left 0.3s ease-in-out;
    z-index: 105;
  }

  .sidebar.open {
    left: 100vw;
  }

  .sidebar-link {
    flex-direction: row;
    justify-content: flex-start;
    padding: 12px 20px;
    height: auto;
    border-bottom: 1px solid #ddd;
  }

  .sidebar-link img {
    margin-bottom: 0;
    margin-right: 15px;
    height: 20px;
  }

  .sidebar-link div {
    font-size: 14px;
    text-align: left;
  }

  .sidebar .fa {
    margin: 15px;
    text-align: left;
  }

  .video-grid {
    grid-template-columns: 1fr 1fr;
    column-gap: 15px;
    row-gap: 20px;
    margin-left: -75px;
  }

  .video-info-grid {
    display: grid;
    grid-template-columns: 30px 1fr;
  }

  .profile-picture {
    width: 25px;
    border-radius: 50%;
  }

  .video-title {
    margin-bottom: 8px;
    font-size: 12px;
    line-height: 15px;
  }

  .video-author,
  .video-stats {
    width: 100px;
    font-size: 10px;
  }

  .video-time {
    font-size: 10px;
  }

  .header {
    padding: 0 10px;
    height: 50px;
  }

  .left-section,
  .middle-section,
  .right-section {
    gap: 8px;
  }

  .youtube-logo {
    height: 18px;
    margin-right: 10px;
  }

  .hamburger-menu {
    height: 20px;
    width: 20px;
    margin-right: 12px;
  }

  .middle-section {
    margin: 0;
    max-width: unset;
    flex: 1;
  }

  .search-button {
    height: 32px;
    width: 45px;
  }

  .voice-search-button,
  .search-bar,
  .youtubeApp,
  .upload {
    display: none;
  }

  .mode-toggle .mode-text {
    display: none;
  }

  .mode-toggle {
    padding: 6px;
  }
}