nav {
      background-color: #333;
    }

    nav ul {
      list-style: none;
      margin: 0;
      padding: 0;
      display: flex;
    }

    nav ul li {
      position: relative;
    }

    nav ul li a {
      text-decoration: none;
      color: white;
      padding: 1em;
      display: block;
      transition: background-color 0.3s ease;
    }

    nav ul li a:hover {
      background-color: #575757;
      color: #f09911;
    }

    /* Submenu styling */
    nav ul li ul {
      display: none;
      position: absolute;
      background-color: #444;
      color: white;
      top: 100%; /* Aligns submenu below the parent */
      left: 0;
      list-style: none;
      padding: 0;
      margin: 0;
      z-index: 1000;
    }

    nav ul li ul li a {
      padding: 0.5em 1em;
      white-space: nowrap; /* Prevents text wrapping */
    }

    nav ul li ul li a:hover {
      background-color: #575757;
      color: #f09911;
    }

    /* Nested submenu styling */
    nav ul li ul li ul {
      top: 0;
      left: 100%; /* Aligns nested submenu to the right of parent */
    }

    /* Show submenu on hover */
    nav ul li:hover > ul {
      display: block;
    }

    nav ul li ul li:hover > ul {
      display: block;
    }