@media screen and (max-width: 768px) {
  .header-wrapper {
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    padding: 0 10px;
  }
  .nav-links {
    margin-left: auto;
    display: flex;
    align-items: center;
  }
  .nav-links ul {
    flex-direction: column;
    width: 100%;
  }
  .nav-links li {
    margin: 10px 0;
  }
  .theme-toggle {
    margin-left: 10px;
  }
  .container {
    padding: 0 10px;
  }

  html, body {
    overflow-x: hidden;
  }

  .modal-content,
  .form-wrapper,
  .dashboard-container,
  .contact-wrapper,
  .container {
    max-width: 100%;
    box-sizing: border-box;
  }

  .dashboard-summary,
  .charts,
  .recent-activity {
    overflow-x: auto;
  }
}