/* Styles for ez-toc-container */
#ez-toc-container {
  background-color: transparent;
  border: none;
  border-radius: 0;
  padding: 16px 0;
  box-shadow: none;
  max-width: 100%;
  margin: 16px 0;
  width: 100%;

  .ez-toc-title {
    font-size: 1.25rem;
    font-weight: 600;
    margin-bottom: 10px;
    border-bottom: 2px solid #ddd;
    padding-bottom: 5px;
  }

  .ez-toc-cssicon-toggle-label {
    display: flex;
    align-items: center;
    cursor: pointer;
    margin-bottom: 10px;

    .ez-toc-icon-toggle-span {
      margin-left: 8px;
    }
  }

  .ez-toc-list {
    list-style-type: none;
    padding-left: 0;

    /* Base styles for all list items */
    .ez-toc-link {
      display: block;
      padding: 8px 0;
      color: #333;
      text-decoration: none;
      border-bottom: 1px solid #f0f0f0;

      &:hover {
        background-color: #f9f9f9;
        border-radius: 4px;
      }
    }

    /* Hierarchy-based alignment */
    .ez-toc-list-level-1 {
      padding-left: 0;

      .ez-toc-link {
        font-size: 1em;
        font-weight: 600;
      }
    }

    .ez-toc-list-level-2 {
      padding-left: 20px;

      .ez-toc-link {
        font-size: 0.95em;
        font-weight: 500;
        padding-left: 10px;
      }
    }

    .ez-toc-list-level-3 {
      padding-left: 40px;

      .ez-toc-link {
        font-size: 0.9em;
        font-weight: 400;
        padding-left: 10px;
      }
    }

    .ez-toc-list-level-4 {
      padding-left: 60px;

      .ez-toc-link {
        font-size: 0.85em;
        font-weight: 400;
        padding-left: 10px;
      }
    }

    /* Add more levels if needed */
  }

  /* Responsive styles */
  @media (max-width: 768px) {
    padding: 12px 0;

    .ez-toc-title {
      font-size: 1.125rem;
    }

    .ez-toc-link {
      padding: 6px 0;
      font-size: 0.9em;
    }

    /* Adjust hierarchy padding for tablets */
    .ez-toc-list-level-2 {
      padding-left: 15px;
    }

    .ez-toc-list-level-3 {
      padding-left: 30px;
    }

    .ez-toc-list-level-4 {
      padding-left: 45px;
    }
  }

  @media (max-width: 480px) {
    padding: 10px 0;

    .ez-toc-title {
      font-size: 1rem;
    }

    .ez-toc-link {
      padding: 4px 0;
      font-size: 0.85em;
    }

    /* Adjust hierarchy padding for mobile */
    .ez-toc-list-level-2 {
      padding-left: 10px;
    }

    .ez-toc-list-level-3 {
      padding-left: 20px;
    }

    .ez-toc-list-level-4 {
      padding-left: 30px;
    }
  }
}